Rounded rectangle in IE not working
Posted: Tue Apr 03, 2007 10:42 am
See this page: http://217.147.94.70/
The grey box on the left with the rounded corners should look like it does in FF. But in IE 6 and 7 the bottom of it has a flat edge as if the background is overflowing. Any clues?
Here's the CSS:
And here's the bit of the markup although you'll probs want to look at the source from the page directly.
I've taken out everything that's nested deeper than "rect5" and it still breaks so it's gotta be something with the CSS from those 5 divs.
I'm just off for a beer after work but I'll respond any replies later. Cheers guys
The grey box on the left with the rounded corners should look like it does in FF. But in IE 6 and 7 the bottom of it has a flat edge as if the background is overflowing. Any clues?
Here's the CSS:
Code: Select all
div.rect1 {
background-image: url(/images/rect_fill.png);
background-repeat: repeat;
}
div.rect2 {
background-image: url(/images/rect_tr.png);
background-position: top right;
background-repeat: no-repeat;
}
div.rect3 {
background-image: url(/images/rect_bl.png);
background-position: bottom left;
background-repeat: no-repeat;
}
div.rect4 {
background-image: url(/images/rect_br.png);
background-position: bottom right;
background-repeat: no-repeat;
}
div.rect5 {
background-image: url(/images/rect_tl.png);
background-position: top left;
background-repeat: no-repeat;
padding: 10px;
}Code: Select all
<div class="rect1">
<div class="rect2">
<div class="rect3">
<div class="rect4">
<div class="rect5">
<div id="releases_bg">
<div id="releases_header">Latest Release</div>
<ul id="releases_list">
<?php foreach ($releases as $release): ?>
<?php foreach ($release as $file): ?>
<li>» <?php echo link_to($file["filename"], $file["url"]) ?></li>
<?php endforeach ?>
<?php endforeach ?>
</ul>
<div class="centered">
Released, <?php echo $releaseDate ?>
</div>
</div>
</div>
</div>
</div>
</div>
</div>I'm just off for a beer after work but I'll respond any replies later. Cheers guys