View Single Post
  #7 (permalink)  
Old Aug 17th, 2007, 14:39
moojoo's Avatar
moojoo moojoo is offline
Moderator
Join Date: Aug 2005
Location: Texas
Posts: 2,020
Blog Entries: 1
Thanks: 0
Thanked 33 Times in 33 Posts
Re: rounded boxes with CSS

Basically you want this to be done in 3 cuts as you planned for.

Top

Middle

Bottom

Code: Select all
#top {
height:7px;
overflow:hidden;
background: url("fooTop.jpg")no-repeat left top;
}

#middle {
background: url("fooMiddle.jpg") repeat-y left top;
}

#middle p {
padding:0 10px 0 10px;
}

#bottom {
 height:7px;
 overflow:hidden;
 background: url("fooBottom.jpg")no-repeat left top;
 }
in HTML

Code: Select all
<div id="wrapper">
<div id="top">&nbsp;</div>
<div id="middle">
<p>Content goes here</p>
</div>
<div id="bottom">&nbsp;</div>
</div>
That should work.

#wrapper will contol the width of the elements.
__________________
I hate IE 6. Just sayin....

Last edited by moojoo; Aug 17th, 2007 at 14:48.
Reply With Quote