Select, Option and dropdown image problem

[ehsan85]

Hello everybody,
Having a problem with "Select" .
I have creaded an from, Original design is like the 1st attachment

Then I converted it to HTML But only mozill firefox can show same as my design. But other browser can show like 2nd attachment

My HTML code was:

<div class="field"><label>Vehicle Condition</label><div class="selectWrapOuter"><div class="selectWrapInner"><select name="vehical"><option>Select</option>
                      <option>Good</option>
                      <option>Ok</option>
                      <option>Damaged</option>
                      <option>Wrecked</option>
                    </select></div></div></div>

And CSS code was:

.selectWrapOuter{
	background:url('img/select-bg.png') no-repeat;
	background-repeat:no-repeat;
	border:1px solid white;
	height:18px;
	float:left;
	-moz-box-shadow: 1px 1px 1px #666;
	-webkit-box-shadow: 1px 1px 1px #666;*/
	box-shadow: 1px 1px 1px #666;
	-moz-border-radius: 5px; /* FF1+ */
  	-webkit-border-radius: 5px; /* Saf3-4, iOS 1+, Android 1.5+ */
	border-radius: 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4 */
}
.selectWrapInner{
	overflow:hidden;
	width:165px;
}
select{
	background:transparent;
	border:none;
	width:188px;
	text-align:center;
}
select option{
	background-color:#ffee7a;
}

Is it Possible with CSS, or If Javascript is better for this Please help me about javascript code.

regards
ehsan