Tabell i float-div

explorer tycker att 100% är 100% av diven, medan firefox tycker att 100% är 100% av webbläsaren. så du har två alternativ.

ett) positionera colTwo

div#colOne {
width:200px;
height:200px;
float:left;
background-color:#ccc;
}
div#colTwo {
position:absolute;
top:0px; left:200px;
background-color:#999;
}

två) sätt till en class som bryter av de flytande divarna samt sätt float:right på colTwo

div#colOne {
	width:200px;
	height:200px;
	float:left;
	background-color:#ccc;
}
div#colTwo {
	float:right;
	background-color:#999;
}
div.clear {
clear:both;
}

<div id="colOne">
	&nbsp;
</div>

<div id="colTwo">

	<table width="100%" border="1" cellspacing="0" cellpadding="0">
		<tr>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		</tr>
	</table>
</div>
<div class="clear">&nbsp;</div>

Inget av alternativen fungerar sorgligt nog. Att absolut positionera högerkolumnen funkar inte eftersom dess bredd måste fylla ut hela den del av fönstret som inte tas upp av vänsterkolumnen. Alternativ 2 fungerar inte av okänd anledning.

Följande kanske kan fungera

div#colOne {
	float:left;
	width:200px;
	height:200px;
	background-color:#ccc;
}
div#colTwo {
	background-color:#999;
	margin-left:200px;
}

Det funkar visserligen på exemplet, men exemplet motsvarar inte längre koden som strular. Jag har försökt destillera ner ett nytt exempel som visar problemet.

I diven "colOne" är menyn tänkt att ligga, till vänster på sidan. Till höger om denna ska innehållet ligga i diven "colTwo". I "colTwo" använder jag ett css-hack (".clearFix") som jag hittade på en sajt någonstans, som löser "float-problemet". Det är nog mer tydligt om man tittar på exemplet (i Firefox) och på koden, än att jag försöker förklara. Jämför då med IE så ser man tydligt felet.

Problemet är hursomhelst att vänsterkolumnen trycker ner allt innehåll som ligger efter float-hacket, i Firefox, och jag ingen aning om varför.

http://member.webforum.nu/1826/test2.html

Det låter som detta problem:

The W3C float specification requires that a cleared element shall stay below all previous floats. There are no exceptions to this requirement! "Previous" in this case means any float that comes earlier in the source document.

[...]

If the clearer is within a floated container, it will clear only the floats that preceed it within that floated container. The clearing element will not reach outside of its floated container to clear external floats. Also, the clearer has no effect on its floated parent container, other than to make it enclose any nested inner floats.

http://www.positioniseverything.net/easyclearing.html

Dock fungerar det inte för mig eftersom jag inte kan sätta en float med fast bredd på "colTwo" eftersom den ska sträcka ut sig på bredden.

http://www.webforum.nu/showthread.php?t=148433
kanske kan hjälpa?

Men se på fan, det fungerar! Underbart! Tack!