One Way to Level the Layout Playing Field


One of my pet peeves about CSS and HTML standards is sometimes, they aren’t overly explicit, and browser vendors pick arbitrary values for things like line height, or margin or padding and the like.  Eric Meyer has talked about a reset.css stylesheet that would effectively eliminate those differences and override the browsers value with the ones that you know and you specify.

I’m excited to see that he posted a version of it (though reading the comments, it sounds like there will be a few revisions coming) on his blog today.  I’d highly recommend checking it out.  He based it on the one from the guys at Yahoo! UI, added a few things and tweaked a few others.  It’s certainly one way to help eliminate those frustrating hair pulling “why isn’t this working” kinds of questions!

Comments (3)

  1. thacker says:

    Thank you.

    Pete–

    Within the same vein, would the addition of  the min-width property with the value of 0 within Meyer’s reset style sheet resolve any of the issues of haslayout within IE?

  2. Tony says:

    This is the only reason why I hate CSS based layouts.  But, if they can come up with a way to set a "middle layer" that would make all browsers behave the same way, I am all for it.

  3. thacker says:

    <a href="http://meyerweb.com/eric/thoughts/2007/04/12/reset-styles/#comment-132254&quot;

    title="Navigate to Ingo Chao’s response on the Meyer Web site.">Ingo Chao</a> provided an excellent response, on Eric Meyer’s Web site, to my question.

    <blockquote>Thacker – haslayout does solve some rendering problems, but it causes new ones. Giving haslayout to all elements would cause text content to stop wrapping around a float. Plus, in some cases, we don’t want to have every float being contained by its parent. Funny things would happen in lists. And it would prevent any margin collapsing. Applying layout to all is not the cure; it cuts both ways. It’s the presence of the current haslayout implementation (and some old pages rely on that), not its absence, that makes it so difficult for IE to comply to some parts of the specification. We can use haslayout concious to kill bugs in some defined scenarios. But a reset style sheet that is blindly applied must refrain from triggering haslayout (in elements that don’t have haslayout by default).</blockquote>

    I am afraid there is no magic silver bullet, holy water, strands of garlic, etc. to kill the haslayout property in content when desired. It is always tripping me up and a lot of other content developers as well.

    Maybe create that silver bullet that applies to only "standards compliant" mode?  When used appropriately, it might eliminate a lot of false ‘bugs’ reports, etc.?

    Just a thought.  Thanks.