3 replies [Last post]
Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 7 years 46 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

From the article, On having layout which I found via Stu Nicholls' site and Tanfa's site they postulate the following revision on the holly hack.

<!--[if IE]><style>.gainlayout { height: 1px; }</style><![endif]--> Assign this class to any element that needs to have layout (hasLayout=true) and it will get it.

However, I think the solution misses a trick. The point on using height - or width or inline-block - is that the style will still validate. Unfortunately each has side-effects and so can't be used everywhere. The author needs to select the correct one for the circumstance. But, ..., with the style placed inside IE conditional comments, it will be ignored by the validator, which removes the only obstacle to using zoom:1 - which has no side effects*.

Which would make the following code, the ubiquitous solution to triggering hasLayout for any element.

<!--[if IE]><style>.hasLayout { zoom: 1; }</style><![endif]-->

[edit]
*zoom is supported by IE5.5+, that is not supported by IE5.

Tags:
Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 31 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

A hasLayout fix without side-effects.

As I read the first conditional comment I thought exactly the same as you Chris, if your going to use the CC then use zoom, as the validation worries are put aside.

However I'm not sure what we really gain from this or their method other than some extra classes in the markup, one generally works out where the height hack is needed and a simple filter in the stylesheet sorts things out, of course if filtering becomes a problem then this, I guess is the sensible alternative.

The only problem with the zoom property I see is when height 1% is needed to auto expand elements.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

IChao
Offline
Enthusiast
Göttingen, Germany
Last seen: 11 years 23 weeks ago
Göttingen, Germany
Timezone: GMT+2
Joined: 2005-08-16
Posts: 148
Points: 0

A hasLayout fix without side-effects.

Philippe has posted an answer to Dean's blog .

The editors had some discussions the last weeks about how the upcoming IE7 and anticipated bug fixes/ongoing layout bugs may/will affect inevitable hacking.

What if the star html hack is not available anymore (since Chris Wilson has questioned it)? What if they fix the height bug, so height:1% gets a meaning? Where is a clean, easy to understand and therefore recommendable hack management? What means "future proof"? And so on.

We are currently making a cut between IE7 and the rest, and we are serving zoom to IE7, and height to the rest.

Of course, this is debatable. Anyway, thanks for the additional input, very much appreciated. Note that the article is still a work in progress (at the moment, we are compiling more thorough information about inline elements and layout).

Ingo

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 7 years 46 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

A hasLayout fix without side-effects.

Original post updated to explain zoom is only available for IE5.5+.