Home/ Questions/Q 522635
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T08:22:29+00:00

Basically my goal is for my page content div to be encapsulated in a

  • 0

Basically my goal is for my page content div to be encapsulated in a round rectangle. Sort of like this:

Top of round rect (White)
Page content (uses a white rectangular css background) 
Bottom of round rect(White)

So then the page content section can be as long as I need and retain the round rect shape. I’m just not sure the best way to do this. I tried adding an img to the top of pagecontent div, but the transparent areas were overridden by the pagecontent’s background. Thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If I understand what you mean you should put the top and bottom divs outside of the content div :

    <html>
<div id=top>&nbsp;</div>
<div id=middle>

... insert page content ...

</div>
<div id=bottom>&nbsp;</div>
</html>

    and then in the css

    #top {
 background : url("top.png") no-repeat bottom center;
 height : <height of image in pixels>px;
 padding : 0;
 margin: 10px auto 0 auto;
 width:<required width>
}

#middle {
 background : url("middle.png") repeat-y top center;
 padding : 0;
 margin: 0 auto 0 auto;
 width:<required width>
}

#bottom {
 background : url("bottom.png") no-repeat top center;
 height : <height of image in pixels>px;
 padding : 0;
 margin: 0 auto 10px auto;
 width:<required width>
}
    • 0