pretty forms
Forms are always interesting and useful on Web pages. But making them look pretty can be very difficult, especially if you want to stay valid and well-formed. Using style sheets is the only way to go.
This article is a good overview for styling your forms. Ever since I started playing with this, it has been one of my favorite additions to my stylesheets. I usually do one stylesheet definition to cover everything, because that keeps it simple, and usually does a pretty good job. For example, here’s what is in my default stylesheet for my blog (the trading spaces inspired one)
input, select, textarea {
font-family:georgia, serif; font-size:11px;
color: #333333; background-color: #cccccc;
border: solid 1px White; padding: 2px;
}
font-family:georgia, serif; font-size:11px;
color: #333333; background-color: #cccccc;
border: solid 1px White; padding: 2px;
}
I always try to include the font-family and size because its not alway inherited from the body or the containing elements. And the border usually makes it look finished, especially combined with some padding to keep the letters typed in the form from touching the edges.
[seen at about: Web Design]
Comments
I have to admit I’ve long thought your forms are pretty! The font-face goes a long way.
Thanks for posting that link!
Posted by: Meredith | July 15, 2003 08:59 AM