how to style an arrow od select drop down box in html?

Question

I only want to change arrow in select box with my own custom arrow without using any javascript and jquery. Any help?

Answer 1

i could not understand you clearly..

here is my thought and suggestion: html:

<div class="my_checkbox">
<input type="checkbox" value="None" id="my_checkbox" name="check">
<label for="my_checkbox"></label>
</div>

and the css:

.my_checkbox input[type=checkbox]:checked + label:after {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}

for all: click me

Answer 2

You can't. It's rendered by the OS, not the browser. There are hack work-arounds using absolute positioning but the control itself cannot be reliably styled across browsers.