List box border styles

HTML & CSS
1

Hey all - Just wondering if anyone knows how to change the border style on a list box.

I’ve tried the following in my stylesheet and it aint working at all.

I’m I being completely dense ??/ :slight_smile:

select {
border-right: #cccccc thin solid;
color: #666666;
border-top: #cccccc thin solid;
font-size: 8pt;
border-left: #cccccc thin solid;
border-bottom: #cccccc thin solid;
font-family: verdana, arial;
margin-top: 1px;
margin-bottom: 1px;
size: 1;
}

This doesnt work and instead of me having a solid border around the box I have the default inset.

Regards.

2

I don’t think that border styles are supported on select boxes in IE.

At least, not according to this.

Andy

3

what is size?!?! there’s no size in css

you’re probably looking for width!?

also… this might help - http://www.sitepoint.com/article/style-web-forms-css

4

select {
border-right: #cccccc thin solid;
color: #666666;
border-top: #cccccc thin solid;
font-size: 8pt;
border-left: #cccccc thin solid;
border-bottom: #cccccc thin solid;
font-family: verdana, arial;
margin-top: 1px;
margin-bottom: 1px;
size: 1;
}

Try this:

select {
border: 1px solid #ccc;
margin: 1px 0 1px 0;
font-size: 8pt;
font-family: verdana, arial;
color: #666;
}

Hope this helped.

Bill

5

Hi,

As Andy said above you can’t change the border on select boxes (in ie anyway) but you can change the background and text colours.

Paul

6

Hey all,

Thanks for you help … having checked the link it appears that select doesnt support the border properties.

Thanks again,

Ronan