Welcome to WebmasterWorld Guest from 54.205.88.118

Forum Moderators: not2easy

Float Right ; Box spills to the left hand side

   
5:27 pm on Mar 27, 2003 (gmt 0)

10+ Year Member



Ok I have a simple relative box with two flanking sides, the center box has repeating boxs down the middle with pictures in some of them floating too the left with the clear; fix to hold its side,
but when i chnge it so it floats to the right, the box spills too the left hand edge in ie6, but not in opera.
any ideas.

some code:
.column-wrap { position: relative; background-color: #6c9; padding-top:1px;z-index:1;}
.column-1 { position: absolute; left: 0px; top: 11px; width: 200px; background-color: #fc0; z-index:3;}
.column-2 { position:relative; margin-left: 200px; margin-right: 300px; margin-top: 10px; background-color: #f90; z-index:3;}
.column-3 { position: absolute; right: 0px; top: 11px; width: 300px; background-color: #ff6600; z-index:3;}
.block { position: relative ;background-color: #555; padding:5px;border:1px solid #ccc;}
img {border: 0; }
img.imglft{
float: right;
position: relative;
height: 280px;
padding: 1px 10px 1px 1px;
}

and the site script :

<div class="column-2-wrapper">
<div class="column-2">
<h2>Column Two</h2>
<div class="block"><p>Filler</p></div>
<div class="block"><img src="images/pictures/mawda3.jpg" class="imglft" align="right"><p>Filler1</p>
&nbsp;<div style="clear: both;"></div></div>
<div class="block"><p>Filler</p></div>
<div class="block"><p>Filler</p></div>
</div>
</div>

7:40 am on Mar 31, 2003 (gmt 0)

WebmasterWorld Senior Member nick_w is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Hmmm... not sure. Anyone?

Nick

12:37 pm on Mar 31, 2003 (gmt 0)

WebmasterWorld Senior Member blobfisk is a WebmasterWorld Top Contributor of All Time 10+ Year Member



I'm not to sure on this one either! Have you tried a display:block on the img.imglft? Also, could the align="right" in the html code be throwing IE out a little? You could try removing that and see if it makes any difference...
2:03 pm on Mar 31, 2003 (gmt 0)

WebmasterWorld Senior Member suzyuk is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Hi it's a strange one.. had a quick look and found that putting a width on the .imglft class (auto did it) seemed to correct this , but it was a quick look and not tested crossbrowser

I seem to remember there is a float: right bug in IE...
can't remember where I found it, or even if it's the same bug..but I'll post it later if I find the link

Suzy
<added>the bug link [positioniseverything.net]</added>

 

Featured Threads

Hot Threads This Week

Hot Threads This Month