steve kwan user experience designer

The great Style Sheet battle of 2005

(August 2nd, 2005 - 8:11PM)

I've been working on a new Web interface for Eloquent's core product. I'm making heavy use of Cascading Style Sheets, and have been trying out the "trick" of using styles to position elements within a document rather than using old-school <table> tags. What a joke.

I suppose there's a degree of convenience in being able to specify positioning within a Cascading Style Sheet, but I really don't think it's worth the effort. I'm hardly a guru, but if what I've seen so far is a good indication, it's almost impossible to make easily make cross-browser Web pages using CSS positioning. Tables are so much simpler.

I'm testing my new site in IE and Firefox, and I'm encountering a really annoying problem with the <button> element. Buttons in Internet Explorer seem to be overly long. Even if I apply zero padding and margins to a styled button, Internet Explorer seems to add its own spacing to the left and right of the button, making it longer. The more text on the button, the longer Internet Explorer wants to make it. Firefox doesn't have this problem.

Is this familiar to anyone? Does anyone know a workaround for this problem? Please let me know.