html - Stacking with position: relative -

i'm attempting stack divs (styled sticky-notes) part of divs on bottom hang out. considered okay, i'll style top-most div normally, , style parts can see bottom divs (as opposed making divs same width+height , stacking them). issue want style border-radius of divs same, , if non-stacking way, border-radius applied top div doesn't yield same design border-radius applied bottom divs (because width+height different top div, i'm guessing).

<div class="stickynote1"> content <div> <div class="stickynote2"> content <div> <div class="stickynote3"> content <div> 

1. is there way fix border-radius issue without resizing divs same width+height?
2. if resize divs same width+height, how can stack them? seems position:relative , z-index combination on divs won't work because position:relative created new container block, somehow making z-index not work other divs' new container blocks.

if you, i'd:

1. add class called stickynote , find common style (in case border-radius) , apply class of them

2. i'm not sure mean stacking them -- when read initial paragraph, thought meant stack them vertically on y axis, seemingly, you're struggling z-axis, seems want stack them on z axis. in case, i'd put 3 of them in container, position container relative, , position 3 stickynote absolute, different z-index, identical x/y position.