Hey all having an issue with making content have a rounded edge box, I have it working how I want it to work in IE but when it’s opened in FF it gets completely screwed up… have a look at it here in both IE and FF.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" >
<head>
<script type="text/javascript"></script>
<style type="text/css" title="mainStyle" media="screen">
@import "round.css";
</style>
</head>
<body>
<div id="container">
<div class="round">
<div class="top"> </div>
<div class="content">
<h3><em><span>Lorem Ipsum</span></em></h3> <p>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the
1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.</p>
<p>
<a href="#" title="Comment on this" class="comment">Comments</a>
</p>
</div>
<div class="bottom"> </div>
</div>
<div class="round">
<div class="top"> </div>
<div class="content">
<h4><em><span>Lorem Ipsum</span></em></h4> <p>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the
1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.</p>
<p>
<a href="#" title="Comment on this" class="comment">Comments</a>
</p>
</div>
<div class="bottom"> </div>
</div>
<div class="round">
<div class="top"> </div>
<div class="content">
<h5><em><span>Lorem Ipsum</span></em></h5> <p>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the
1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker
including versions of Lorem Ipsum.</p>
<p>
<a href="#" title="Comment on this" class="comment">Comments</a>
</p>
</div>
<div class="bottom"> </div>
</div>
</body>
</html>
.content {
clear: left;
float: left;
margin: 10px 0 0 0;
padding: 10px 20px 10px 30px;
width: 500px; /* for IE */
voice-family: "\"}\"";
voice-family: inherit;
width: 450px;
}
.round {
background: url(contentbox-mid.gif) #fff top repeat-y;
width: 500px;
}
.top {
background: url(contentbox-top.gif) #fff top left no-repeat;
height: 39px;
width: 500px;
}
.bottom {
background: url(contentbox-bot.gif) #fff bottom left no-repeat;
height: 39px;
width: 500px;
}
/* Be Nice to Opera */
html>body .content {
width: 450px;
}
.comment {
color: Green;
font-size: x-small;
padding: 0 0 0 10px;
}
