W3C home > Mailing lists > Public > www-style@w3.org > August 2005

Re: Styling form controls

From: Boris Zbarsky <bzbarsky@mit.edu>
Date: Mon, 15 Aug 2005 19:59:03 -0500
Message-ID: <43013A57.6030201@mit.edu>
To: Garrett Smith <dhtmlkitchen@gmail.com>
CC: css-d@lists.css-discuss.org, www-style@w3.org

Garrett Smith wrote:
> For example
> <button style="display: block; border:1px solid
> red;padding:0;margin:0"><div>content</div></button>
> 
> Safari is the only browser that renders the above example correctly

What is "correctly"?  What does "padding" mean in this context?  There are at 
least two separate areas of a button that could be considered the "padding".

This is the real reason that browsers do odd things when CSS is applied to form 
controls -- CSS is not capable of describing the desired rendering of said form 
controls, so browsers have to make up some sort of rendering and only map CSS to 
bits of it.  They differ in which bits they pick.

It sounds like you're making some assumptions about how this mapping should be 
done that match what Safari does and don't match what other browsers do, but 
that's a matter of your assumptions, not of the browsers implementing anything 
incorrectly.

> Perhaps display: auto would describe what most UA's do now; they just
> use their own native-type of gui.

In what way does your example not lay out as a display:block replaced element? 
Care to explain?  As for why it needs to be a replaced element, see the section 
above....

> Let the appearance be determined by the CSS

This requires significant expansion of CSS, if you're going to be able to 
accomodate everything people want out of buttons as far as appearance goes....

> <input type=:"checkbox" style="display: block" /> does not work.

In what way?  Again, it displays as a block-display replaced element in my testing.

> checkbox {
>    background: #fff url(/img/checkbox.gif) no-repeat;
> }

Gecko in particular disables styling of checkbox backgrounds altogether because 
the way IE styles them and the way Gecko would style them are quite different 
(they have different concepts of what the "background" of the checkbox is, which 
is just as fuzzy a concept as "padding" on a button), so that pages written for 
IE's rendering make the checkbox invisible in Gecko.

-Boris
Received on Tuesday, 16 August 2005 00:59:18 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:40 GMT