Hi all,
I am using the "Bullet-Proof Rounded Corners" found here
http://www.albin.net/CSS/roundedCorners/ to make some divs with rounded
corners. It looks perfectly fine in FireFox OS X, but in IE 6 (Win2K), I get
vertical bars.
I'm using the CSS from the URL for that section, with these few
modifications:
/**********************
** Rounded Corners
***********************/
.roundedContent {
margin: 0px;
padding: 0px;
border: 1px solid #000;
color: #000;
background-color: #69F;
text-align: justify;
}
.roundedContentWrapper {
/* position this div however you want, but
keep its padding and border at zero */
padding: 0px;
border: 0px;
}
.roundedContent p
{
color: #000;
background-color: transparent;
}
And then here is the markup:
<div class="roundedContentWrapper">
<div class="roundedContent">
<img class="borderTL" src="/images/misc/borderTL.gif" alt=" "
width="14" height="14" />
<img class="borderTR" src="/images/misc/borderTR.gif" alt=" "
width="14" height="14" />
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut augue tellus,
eleifend pulvinar, molestie sed, bibendum vel, pede. Mauris non felis. In
sit amet dolor in nisl congue aliquam. Donec et quam non tortor mattis
tristique.
</p>
<p>
Nulla rutrum velit quis magna adipiscing tempus. Duis nunc. Sed lectus nisi,
tempor, condimentum a, ornare vitae, orci. Mauris pharetra ligula nec leo.
Suspendisse potenti. Quisque lacinia consequat sem. Sed rutrum, tellus nec
blandit scelerisque, enim erat tempus ligula, vel ultrices eros nunc sed
massa.
</p>
<!-- IE5/win puts the margin-bottom of the content div's final element
OUTSIDE the containing box (div.content), instead of putting it inside
the containing box's edge. So it needs this spacer. -->
<div class="roundedCornerSpacer"> </div>
</div><!-- end of div.content -->
<div class="bottomCorners">
<img class="borderBL" src="/images/misc/borderBL.gif" alt=" "
width="14" height="14" />
<img class="borderBR" src="/images/misc/borderBR.gif" alt=" "
width="14" height="14" />
</div>
</div><!-- end of div.contentWrapper -->
Am I doing something wrong, or is there an easier/better solution you all
would recommend?
Thanks,
Ryan
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
