Need a little CSS help

johnnyboy posted this at 21:04 — 2nd April 2001.

Joined: Jan 2000

Hi, haven't posted here in a while. Been busy studying and things have slowed a little on the web design front for me.

I've got a question that I'm sure someone here can answer: What is the CSS property/value for making Form checkboxes and drop down menus have just a narrow black border? I think I've seen it done. I just can figure out how to do it.

Here's what I've come up with so far for input boxes: input {border-style: 1px; border-color: black; } but, it doesn't work for check boxes and drop down menus.

Just a little nudge in the right direction is all I need. Oh, and if you could show me how to make the border on text boxes even thinner, that would be cool too!~!

interwovendesign.com
Quality web site design without the monthly maintenance fees!

detox posted this at 00:28 — 3rd April 2001.

They have: 571 posts

Joined: Feb 2001

here is my usual style definition,

.login {
font-family: Verdana, Arial;
font-size: 11px;
border: 1px solid;
width: 70px;
background:AFAF7E;
}
Apply this to a text box select box etc

.submit {
background: :cccc99;
font-size: 10px;
font-family: Verdana,'Comic Sans MS',Arial,Sans- Serif, Helvetica;
font-weight: normal;
}
apply this to submit buttons.

Netscape renders these quite badly sometimes, however, using these can spice up a page quite well....

also, check out this page.. or just do a search on the net for css properties + forms..

http://webdeveloper.earthweb.com/pagedev/webcss/article/0,,12317_639551,00.html

Mark Hensler posted this at 05:35 — 3rd April 2001.

He has: 4,048 posts

Joined: Aug 2000

The only arguments that border-style takes are: none, dotted, solid, double, groove, ridge, and inset. And when you give the value to border-style the order is for the top, right, bottom, and left sides, seperated by a comma. If only one value is given, it will take effect for all sides.

.blah { border-style: solid, double, solid, double }
.blah2 { border-style: dotted }

'
For thickness, use border-top-width, border-bottom-witdh, border-right-width, and border-left-width (or border-width for all sides). Valid values are thin, medium, normal, and thick, or any number with a unit (1px).

.blah { border-width: thin }
.blah2 { border-top-width: 2px }

'
Alternatively, you can use the border property to define all attributes of the borders of all sides (or you can use each seperately by: border-top, border-bottom, border-right, border-left). Using the border property, you can define the border style, color, and width.

.blah { border: thin inset green; border-top: 2px inset red }
.blah2 { border-top: thick groove blue }

You may want to think about investing in a good bood that covers CSS. I own The Complete Refence HTML Second Edition by Thomas A. Powell (publisher is Osborne; 1,130 pages). It's a great book, I highly recommend it. The price on the back is $39.99.

Mark Hensler
If there is no answer on Google, then there is no question.

Suzanne posted this at 16:16 — 3rd April 2001.