On 17/06/2011 8:40 PM, Peter Bradley wrote:
Ar 17/06/11 06:03, ysgrifennodd Alan Gresley:
Yes, override them with specificity in style.css.
div#site-title {
float: none;
width: auto;
}
div#branding {
width: auto;
}
Ah yes. Sorry, I was being more than a little slow there.
I haven't check the site since that has leads me often into creating
IE7- bug cases and knowing IE7, this could take forever. The float in
the above CSS may be OK.
I guess you don't quite understand hasLayout. It's like mixing the
poison and the antidote together. May I suggest to you that you read
this.
http://www.satzansatz.de/cssd/onhavinglayout.html
You're absolutely right. I've tried. Honestly I have, but it's been
beyond me so far. I'll give it another go, though. I owe you that much.
You don't owe me anything. If I desired, I could write hasLayout the
missing manual. Let's break it down a little.
1. IE7- does now how to flow things around floats when floats
drop.
2. IE7- does not paint a page like other browsers and when
part of a page (a box) is higher than 150px, you can have
painting bugs arises like the pee-ka-boo bug and escaping
float bug. In IE6-, you also need hasLayout to remove
white-space from around list-items.
3. When element gain layout, they form a rigged rectangle
box which wraps completely around a child element that
also has layout. You could say that certain things can
not protrude over hasLayout boundaries and any sense of
calculating where something should be is destroyed somewhat.
Here is a simple demo.
<!doctype html>
<style type="text/css">
p { background: silver; }
.float { float: left; width: 200px; height: 100px; border: 5px solid blue; }
#wrapper { border: 5px solid green; }
</style>
<div id="wrapper">
<div class="float">Float 1</div>
<div class="float">Float 2</div>
<div class="float">Float 3</div>
<p>Some text</p>
</div>
If you narrow the viewport enough (I'm testing in IETester IE6 mode),
you will notice floats dropping but unlike other browsers, the paragraph
and the div#wrapper also drops. Note the space that appears between the
floats as they drop. After the third float has dropped, you will notice
that the green border does not enclose 'Float 2' properly. Now add this
to the CSS.
#wrapper { border: 5px solid green; background: url(go-ie.yeah); }
Now this time as the third float has drops, the green border is intact.
All I did was gave IE7- some garbage and IE7- said cool, thank you. This
give meaning to the words by Molly the cat "The absurdity of bugs." Very
wise cat indeed. These pages may help you more.
http://css-class.com/test/bugs/ie/renderingbands.htm
http://css-class.com/articles/explorer/floats/escaping-floats-peekaboo.htm
http://css-class.com/articles/explorer/floats/floatandcleartest1.htm
http://css-class.com/test/bugs/ie/ie-bugs.htm
A word of caution. IE7 emulation mode in IE9 does not have the
pee-ka-boo bug.
--
Alan Gresley
http://css-3d.org/
http://css-class.com/
______________________________________________________________________
css-discuss [css-d@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/
