How do I change an ASP.NET listbox border from 3d to 1px solid?

Question

By default the listbox in ASP.NET has a 3D border effect. I need to change that to Solid, 1 px, some color. Can this be done using css?

Thanks, Atul

Answer 1

I think that for ie, certain properties of the select tag are not styleable. Something to do with the rendering of it tied to the OS. Not sure about ie8.

Here is something that styles borders, but its involved:

http://v2.easy-designs.net/articles/replaceSelect/

Answer 2

You can give your ListBox control a CSS class and then use that to define the border you like in your stylesheet.

<asp:ListBox id="YourListBox" CssClass="SomeClassName" rows="3" runat="server" />

Answer 3

Or you can use Asp.net Themes and Skins

Answer 4

For the border you can use a div as list box's parent:

CSS

.myborder {border: 1px solid blue;}

MARKUP

<div id="contents" runat="server" class="myborder">
  <asp:ListBox ID="lbxItems" runat="server"></asp:ListBox>
</div>

Note: This solution only works for IE8+, not IE7.