Gernot Back: Selectbox ohne Border

Beitrag lesen

Hallo Rainer,

kann man bei einem <select> mit CSS den border "ausschalten"?

der IE sträubt sich da etwas, border:none reicht da nicht. Aber wenn man das Select-Element in ein anderes Element packt, dem ich hier die Klasse "clipper" gegeben habe, geht es auch in Firefox 1.5 und 2 sowie Opera 9, im IE nur bei eingeschaltetem JavaScript, in Netscape 7.1 aber leider gar nicht:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
        "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
<title>Dropdown ohne Umrandung</title>  
<style type="text/css">  
[code lang=css]  
.clipper {  
   overflow:hidden;  
   float:left;  
}  
  
.clipper select {  
   font-size:1em;  
   border:none;  
}

</style>
<!--[if IE]>
<style type="text/css">
.clipper select {
   margin:-2px;
   width:expression(parentNode.offsetWidth +4);
}
</style>
<![endif]-->
</head>
<body >
   <form name="myForm" action="#" method="post">
      <span class="clipper">
         <select name="mySelect">
            <option>erste Wahl</option>
            <option>zweite Wahl</option>
         </select>
      </span>
   </form>
</body>
</html>
[/code]
Gruß Gernot