Sent by Usamah M. Ali on 8 March 2008 17:05
Hello all,
I'm having a weird CSS behavior that is happening only in IE7. It's a
box that having rounded corners on both top-left & bottom-left sides.
The problem is that one of the rounded corner images always jumps off
its original place and spans into the content area.
Here's a screenshot of the problem for better illustration:
http://img373.imageshack.us/img373/5664/ie7weirdxo6.gif
The small image in the middle is supposed to be in place of the red
circle. The CSS technique is a traditional old approach for achieving
CSS rounded corners:
<div class="searchbox">
<div class="search_top"></div>
<div class="search_content">
<form action="http://sawa.org.sd/search/" method="get">
<input type="text" name="q" value="" size="17"/>
<input type="submit" value="Search" id="submitSearch"/></p>
</form>
</div>
<div class="search_bottom"></div>
</div>
The rounded corner images are applied to .search_top & .search_bottom
as follows:
..search_top {
background:transparent url(../images/tlc.gif) no-repeat left top;
height:15px;
}
..search_bottom {
background:transparent url(../images/blc.gif) no-repeat left bottom;
height:15px;
}
This happens randomly. The page loads once with the image spanning
off, and if I refreshed the page it's back to its original place! Also
it's happening only with the top-left image. While I have no evidence,
I'm 100% it's happening only in IE7, not IE6 (having tested in IE
below 6). Needless to say no such quirks in Firefox or Opera.
Thanks in advance,
Usamah
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
