# Customizing FORMFIELDS / DROPDOWNS using CSS

**URL:** https://forum.kirupa.com/t/customizing-formfields-dropdowns-using-css/325373
**Category:** web dev
**Created:** [October 12, 2011, 2:23am UTC](https://forum.kirupa.com/t/customizing-formfields-dropdowns-using-css/325373 "2011-10-12T02:23:22Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![BUroKHUli](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/burokhuli/32/190_2.png) [@BUroKHUli](https://forum.kirupa.com/u/BUroKHUli)
#### Post date: [October 12, 2011, 2:23am UTC](https://forum.kirupa.com/t/customizing-formfields-dropdowns-using-css/325373/1 "2011-10-12T02:23:22Z")

</div>

Hi guys, I’m just starting to learn advance css coding and was playing around on how to customize a formfield. I was successful with the SEARCH BAR but is having problems with the DROPDOWN OPTION. I attached a screenshot on how the file looked like on IE vs FIREFOX, and another file that I wish to achieve the looks from.

I can not seem to find any tutorial here (Kirupa’s) and even is unlucky with google lately. Can someone please point me somewhere?

thank you

HTML File:

```php
<html>
<head>

<title>CSS Custom Text Field</title>

<link href="style.css" type="text/css" rel="stylesheet" />

</head>

<form>
<div class="fieldHolder">
<input type="text" name="field" class="textInput2" />
</div>
</form>

<br><br>
<div class="fieldHolder">
<select name="select" class="textInputSelectOption">
  <option value="www.asdfsa.com">------- please select imprint -------</option>
  <option value="www.nokia.com">Nokia</option>
  <option value="www.google.com">Google</option>
  <option value="www.netscape.com">Netscape</option>
</select>
</div>

</body>
</html>

```

CSS File:

```php
<html>
<head>

<title>CSS Custom Text Field</title>

<link href="style.css" type="text/css" rel="stylesheet" />

</head>

<form>
<div class="fieldHolder">
<input type="text" name="field" class="textInput2" />
</div>
</form>

<br><br>
<div class="fieldHolder">
<select name="select" class="textInputSelectOption">
  <option value="www.asdfsa.com">------- please select imprint -------</option>
  <option value="www.nokia.com">Nokia</option>
  <option value="www.google.com">Google</option>
  <option value="www.netscape.com">Netscape</option>
</select>
</div>

</body>
</html> 

```
