Styling Forms
Web forms are the primary way visitors interact with a Web site. By supplying information on a form, you can join a mailing list, search a database of products, update your personal profile on MySpace, or order that Star Wars collector's plate you've had your eye on.
There's no reason your forms need to look like all the others on the Internet. With a little CSS, you can style form fields to share the same formatting as other site elements like fonts, background colors, and margins. There aren't any CSS properties specific to forms, but you can apply just about any property in this book to a form element.
The results, however, can be mixed (see Figure 10-7). Browser support for styling form elements varies greatly. Safari 2 and earlier limits styling to only a few form elements like text fields and the <fieldset> and <legend> tags. It won't let you change the look of buttons, checkboxes, radio buttons, or pull-down menus. Even Internet Explorer and Firefox may display the same form elements differently. The next section tells you which properties work best with which form tags, and also lists which browsers interpret them properly.
Get CSS: The Missing Manual now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
