Ok, two in one since it is the same case. Mark Wheeler wrote: > First off, thank you to Michael for putting my script up on a site. > Sorry about that. I forgot that's the way to go. It's been a while > since I've been here. > > Second, Gunlaug - That did the trick. I'm still fairly new at css, > trial and error and all that. I never would have thought about using > the overflow attribute to contain the div. I skimmed through the > w3.org info and didn't fully understand it. I need to read it some > more I guess. But in a nut shell (If that's possible) why doe the > overflow: hidden make the float work as I wanted it to?
Well, the answer is in the text: "... establish new block formatting context". <http://www.w3.org/TR/CSS21/visuren.html#q15> That means (among other things) "complete separation" or "isolation" from its surroundings, while the container itself behaves in the page-layout as the styling says. The one I used: 'overflow: hidden;' does just that and nothing else, which makes it practical in some cases but definitely not in others. Example: I can't use 'overflow: hidden;' all that often because it would cut off my many "over the edge" elements like titles and such. See on: <http://www.gunlaug.no/contents/wd_example_01_04.html> how that will turn out. This example: <http://www.gunlaug.no/contents/wd_example_01_03.html> use 'display: table/table-cell', but there are some differences between browsers for that one too. I use 'float:left/right' whenever I can (or have to), as floats work quite well across browser-land - even in IE/win. Of course: not everything can be floated, so the other alternatives are good to have. Michael Geary wrote: > So I understand why the "overflow: hidden;" fixed it, but could you > explain what the IE-specific "zoom: 1;" is for? I tried leaving it > out and IE still looked OK. I put it back in "just in case" but would > like to understand what its purpose is. Thanks! The proprietary 'zoom: 1;' acts as a 'hasLayout' trigger in IE5.5+. It does (of course) not validate, but it is one of the few triggers that isn't likely to give negative side-effects - almost regardless of layout it is used on. >> 'Not quite the same standard', for IE/win only: >> <http://www.satzansatz.de/cssd/onhavinglayout.html> The choice of >> hack (or not) depends on entire layout in each case. > > > Yes, I've studied that page too - it's a great piece of research. > > In this particular case, my page looked OK in IE but was bad in > Firefox, so an IE hack wouldn't have helped - but the overflow trick > was just the ticket. If there's already a 'hasLayout' trigger in place - like 'width' or 'height', then 'zoom: 1;' won't have any additional effect. In such cases 'zoom: 1;' should not be used. Note that 'zoom: (any values other than 1 or 100%);' will make IE/win zoom that container, somewhat like Opera does but Microsoft has taken an entirely different approach. Thus, be careful with the value :-) regards Georg -- http://www.gunlaug.no ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
