We would like to know how to style select to be flat.
<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
select {<!-- ww w . j a v a 2 s . c o m-->
border: 1px solid #666;
}
select.new {
border: 1px solid #666;
-webkit-appearance: none;
padding-right: 20px;
background-size: contain;
}
</style>
</head>
<body>
OLD:
<select><option value="1">Option 1</option></select>
<br /> NEW:
<select class="new"><option value="1">Option 1</option></select>
</body>
</html>
The code above is rendered as follows: