Re: [css-d] problem with IE 6 Double Margin Bug?
Gunlaug,
As always your help is amazing! Thank you. And also, Thank you to all
who have helped me along the way to get down to the point, where I
only had 3 bugs left to fix! :)
One question I did have though... I understand the .content {display:
inline;} and the leftColumn {position: relative;} but what does the *
html .wrapper {zoom: 1;} do exactly?
I put it up at the top of the css file, and it works, but is that the
best place to put it? Or should it go somewhere else?
Thanks again Everyone!
On Jan 14, 2008, at 4:44 PM, Gunlaug Sørtun wrote:
Jason Pruim wrote:
I have done some searching about the double margin bug, and have
tried to do Display: inline and margin-left: -80px;
_margin-left-160px but neither wants to work. Do I have the right
bug?
HTTP://www.raoset.com
Yes, you have the right bug, but you're targeting it on the wrong
element.
There are also some other IE6 bugs involved.
The addition of...
.content {display: inline;}
.leftColumn {position: relative;}
* html .wrapper {zoom: 1;}
...will kill the right IE6 bugs on the right elements.
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
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/
--
Jason Pruim
Raoset Inc.
Technology Manager
MQC Specialist
3251 132nd ave
Holland, MI, 49424
www.raoset.com
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
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/
Re: [css-d] problem with IE 6 Double Margin Bug?
Jason Pruim wrote:
One question I did have though... I understand the .content {display:
inline;} and the leftColumn {position: relative;} but what does the
* html .wrapper {zoom: 1;} do exactly?
It's a 'hasLayout'[1] trigger, and in your case I found the non-valid
'zoom' to work best - alternative (valid) triggers tended to have
negative side-effects. I also had to use the '* html' hack to target IE6
(and below), to avoid conflicts with some of IE7' internal bug-fixes.
Without this 'hasLayout' trigger IE6 seemed to interpret .wrapper's
dimensions a bit unreliable - changed positions for .wrapper's children
when hovering links - which is a clear sign that IE6 couldn't determine
.wrapper's dimensions and relation to other elements.
Triggering 'hasLayout' means to lay out the area of .wrapper -
stiffen up IE6' backbone so it immediately interprets exactly how wide
.wrapper is, and where to position .wrapper's children relative to
.wrapper's edges. Result: stable rendering.
I put it up at the top of the css file, and it works, but is that the
best place to put it? Or should it go somewhere else?
Put it anywhere you like where IE6 can pick it up, as long as it is
complete - as I wrote it. The CSS validator will flag it as an error
anyway - unless it is hidden in a conditional comment or something to
that effect.
regards
Georg
[1]http://www.satzansatz.de/cssd/onhavinglayout.html
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
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/
Re: [css-d] problem with IE 6 Double Margin Bug?
On Jan 15, 2008, at 4:09 PM, Gunlaug Sørtun wrote:
Jason Pruim wrote:
One question I did have though... I understand the .content {display:
inline;} and the leftColumn {position: relative;} but what does the
* html .wrapper {zoom: 1;} do exactly?
It's a 'hasLayout'[1] trigger, and in your case I found the non-valid
'zoom' to work best - alternative (valid) triggers tended to have
negative side-effects. I also had to use the '* html' hack to target
IE6
(and below), to avoid conflicts with some of IE7' internal bug-fixes.
Without this 'hasLayout' trigger IE6 seemed to interpret .wrapper's
dimensions a bit unreliable - changed positions for .wrapper's
children
when hovering links - which is a clear sign that IE6 couldn't
determine
.wrapper's dimensions and relation to other elements.
Triggering 'hasLayout' means to lay out the area of .wrapper -
stiffen up IE6' backbone so it immediately interprets exactly how
wide
.wrapper is, and where to position .wrapper's children relative to
.wrapper's edges. Result: stable rendering.
Haven't had a chance to read all of that website yet, but thank you
for it. It's an interesting read so far! It does bring up the question
as to why exactly Microsoft feels they need to do that :) But I'm sure
I can search the archives, and the web to find out lots of theories
about that! :)
Thank you for taking the time to answer! Always appreciated!
--
Jason Pruim
Raoset Inc.
Technology Manager
MQC Specialist
3251 132nd ave
Holland, MI, 49424
www.raoset.com
[EMAIL PROTECTED]
__
css-discuss [EMAIL PROTECTED]
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/
[css-d] problem with IE 6 Double Margin Bug?
Hi All :) Recently it was pointed out to me, that I still have a few issues in regards to internet explorer on my site... I am on a quest to squash all those out so I don't have to worry about it. So here's my question: I have done some searching about the double margin bug, and have tried to do Display: inline and margin-left: -80px; _margin-left-160px but neither wants to work. Do I have the right bug? The website is here: HTTP://www.raoset.com And the CSS: HTTP://www.raoset.com/media/css/main.css Any help with this is greatly appreciated. Thanks for looking! -- Jason Pruim Raoset Inc. Technology Manager MQC Specialist 3251 132nd ave Holland, MI, 49424 www.raoset.com [EMAIL PROTECTED] __ css-discuss [EMAIL PROTECTED] 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/
Re: [css-d] problem with IE 6 Double Margin Bug?
Jason Pruim wrote:
I have done some searching about the double margin bug, and have
tried to do Display: inline and margin-left: -80px;
_margin-left-160px but neither wants to work. Do I have the right
bug?
HTTP://www.raoset.com
Yes, you have the right bug, but you're targeting it on the wrong element.
There are also some other IE6 bugs involved.
The addition of...
.content {display: inline;}
.leftColumn {position: relative;}
* html .wrapper {zoom: 1;}
...will kill the right IE6 bugs on the right elements.
regards
Georg
--
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
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/
