> What is the cause of the right-column float drop in IE/6: > > 1/ it is not properly cleared? > 2/ the left-column is too wide? > 3/ the left-column is too wide /and/ the float needs to be cleared? > 4/ none of the above?
Thanks for the steps. I will follow then in further float drop issues. > > /Start/ with the left-column is too wide. Consequently, the right- > column > drops because it does not have a wide enough berth to slip into. So a simple math problem? Left-column + right-column + respective margins bigger then container, then, drop? I have made this counts, and it gives me 930 of 950 available on the wrapper, so I suppose the problem don't rely on the width. If we put display:inline on my float elements; those "double margins" values disappear on IE6. http://www.positioniseverything.net/explorer/doubled-margin.html > #content > { > border: 1px solid red; <----- :: add :: > overflow: hidden; <----- :: add :: > } Why overflow: hidden; ? I'm probably wrong but, it seems that it's nothing to do with actually hiding the overflow, since I suppose rarely we would like to hide the overflow. According to the source provided, http://www.satzansatz.de/cssd/onhavinglayout.html Overflow, when not set to auto, is one of the properties responsible for giving *hasLayout* to true on a given element. Without overflow: hidden; neither IE or FF were displaying the background image. My question is: *why was ff not displaying the background image?* When we do: overflow:hidden; both, FF and IE displays the background image. However, firefox had placed the content side by side with the header: http://www.nuvemk.com/rebelate/rebelatehome/home3.html IE puts the content below the header. (even if I don't float, so I presume it deals differently with the attribute hidden of the overflow property? Anyway, since firefox is a nice browser, I have left floated the content and it worked. Since float is also a property that triggers hasLayout property to true, I have removed overflow:hidden; To make the story short: Thanks! :) Final result: http://www.nuvemk.com/rebelate/rebelatehome/home4.html http://www.nuvemk.com/rebelate/rebelatehome/css/home4.css Please advice: On IE 6 and IE 7, the footer is 1 or 2 to the right and overlaps the below content. I have seen two solutions: Apply clear:both; on the footer. It's there. Take out, structurally, the footer from the wrapper. (I preferred to not do this). Any other suggestions? Thanks a lot, Márcio ______________________________________________________________________ css-discuss [cs...@lists.css-discuss.org] 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/
