Sachin B. R. Sachin B. R. - 1 year ago 164
jQuery Question

How to make an input type text look like select dropdown?

Is there any way by which I can make an input type=text element look like a dropdown? Currently I have a text box which when clicked I am displaying options using jquery and div. I want the text box to have a drop down icon to make it exactly look like a regular dropdown.

Also since different browsers have different dropdown icon is there a way to use the same dropdown icon that the browser provides?

I have to apply some css to the option values before displaying it which I cant do using regular dropdown. That is why I have used div and jquery to display the option values.

Answer Source

I think this is when :after pseudoelement gets in handy. Wrap your input in DIV.

 #wrap:after {
     content:arrow icon image;


But there's no way you could use different CSS style sheet for different browser yet, so only one type of icon so far.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download