May
14
If you're unfamiliar with hasLayout and IE's CSS difficulties surrounding this mysterious camel-cased word, you'll want to read the article that covers the majority of it all. If there's one thing I dislike about Internet Explorer...ok, I probably honestly couldn't choose just one thing about IE that disturbed me, but when dealing with CSS, IE's internal hasLayout property is definitely one of those that I never remember to be aware of. Recently, I had a problem with list-items that were not being properly styled. The problem? After getting help on a forum, someone suggested hasLayout; stunned, bewildered, and in denial (both that it could solve the problem, and that I had forgotten about hasLayout itself), after 20 seconds, I found the problem, and the one who helped was right.
Well, ok...so how do we set the hasLayout property to true? There are a number of different ways.
Well, ok...so how do we set the hasLayout property to true? There are a number of different ways.
Most of the time, one will set a height, a width, or a non-standard and non-validating property of zoom. These are the most common solutions to solve the problem. Unfortunately, I didn't want to have a specific width set, as I was working with list-items, and I really don't know if different browsers calculate the width for these items differently, even if I was using conditional stylesheets (Do you include the bullet, or exclude the bullet in the width -- padding, margin, etc...?). I definitely didn't want to set a height. I prefer standards, so I really didn't want to use zoom (no hacks in my CSS sheets yet for this design!).
So then, what to do? Thankfully, within the signature of the one who brought the problem to my attention was a link over a solution called "Trip switch". By setting the value of display, and then resetting it, IE retains the hasLayout property...because it's just that "smart". Whatever, works for me!
Trip switch article's example code:
Aaaaaaaaaaaaaaaand... it worked! IE7 didn't need the fix (though it may on certain conditions from what I've read) so I do technically have two separate conditional stylesheets (I already did anyway), but hey -- it works!
Hopefully distributing this knowledge to others will be helpful some day. Here's hoping.
So then, what to do? Thankfully, within the signature of the one who brought the problem to my attention was a link over a solution called "Trip switch". By setting the value of display, and then resetting it, IE retains the hasLayout property...because it's just that "smart". Whatever, works for me!
Trip switch article's example code:
Aaaaaaaaaaaaaaaand... it worked! IE7 didn't need the fix (though it may on certain conditions from what I've read) so I do technically have two separate conditional stylesheets (I already did anyway), but hey -- it works!
Hopefully distributing this knowledge to others will be helpful some day. Here's hoping.
0 Trackbacks