title: ASP.NET ListBox Styling - Remove Borders and add Shading
body: <p>So I'm having a heck of a time doing something that I think should be so simple.</p>
  
  <p>I have an <code>&lt;asp:ListBox /&gt;</code> element that I want to style, as I think the default looks horrendous, especially the border.</p>
  
  <p>But very few attributes seem to take effect in CSS, most notably the border cannot be removed.</p>
  
  <p>The caveat is that I need it to work in IE8 and IE7, not just other more modern browsers.</p>
  
  <p><a href="http://obout.com/ListBox/aspnet_live_styles.aspx" rel="nofollow">This example site</a> has beautiful listbox elements, but I can't get anywhere close to them.</p>
  
  <p>Any thoughts?</p>
  
  <p>Heres the HTML:</p>
  
  <pre><code>&lt;asp:ListBox ID="ListBox1" runat="server" SelectionMode="Multiple" AutoPostBack="true"
      onselectedindexchanged="ListBox1_SelectedIndexChanged" CssClass="myListBox" &gt;
      &lt;asp:ListItem&gt;ITEM 1&lt;/asp:ListItem&gt;  
      &lt;asp:ListItem&gt;ITEM 2&lt;/asp:ListItem&gt;  
      &lt;asp:ListItem&gt;ITEM 3&lt;/asp:ListItem&gt;  
      &lt;asp:ListItem&gt;ITEM 4&lt;/asp:ListItem&gt;  
  &lt;/asp:ListBox&gt;
  </code></pre>
  
  <p>And the CSS:</p>
  
  <pre><code>.myListBox
  {
      border-style:none;
      border-width:0px;
      border: none;
      font-size:12pt;
      font-family:Verdana;
  }
  </code></pre>