I created a top rounded corner gif (one of 3) with the PS rounded rectangle tool, drawn over the top of the white background of the field created when I created a new page with the dimensions 385px (w) x 118px (h) for the top.image gif. Then I added a background color to each of the three pages I made, top, middle, bottom, plus the drop shadow and bevel and emboss for each section, each in a new layer. I had to reverse the shadow for the bottom since I used the top, inverted for the bottom. I also had to white out the background of each image outside of the drop shadow on the right, because I didn't make the box clear to the right side originally. The box just expands to make room for the text as I type this in the code. I just copied the CSS code from Heather Hogan's blog to get the CSS, and put it all in my "rounded corners" file. I just copied over her version of the original rounded 3 corners gifs. This is all saved with my other DW files as "practice" and "rounded corners" on the desktop.

View the source of this page to see all the HTML and CSS code.