How to use icons in a drop-down list? [duplicate]
I have researching this for a while but can't see how to do this.
Basically I am trying to use icons in a drop-down list, e.g.:
<form method="get" action="testdocs-db.php" name="search" id="search" class="search">
<input type="hidden" name="dosearch" value="true">
<table width=600 border=0>
<tr>
<td>File Type:</td>
<td>
<select name="filetype" size="1" >
<option selected>any</option>
<option id="text">text</option>
<option id="msword">msword</option>
<option id="excel">excel</option>
<option id="powerpoint">powerpoint</option>
<option id="pdf">pdf</option>
<option id="jpeg">jpeg</option>
<option id="png">png</option>
<option id="bmp">bmp</option>
<option id="gif">gif</option>
</select>
</td>
</tr>
</table>
This drop-down is part of form inside a table which is used to search a database and return the results.
Any help would be much apprecia开发者_JS百科ted.
Regards, Martin
Short answer: You can´t.
If you want to use icons in a drop-down, you will have to make a 'fake' drop-down menu using for example an unordered list and use javascript to copy the clicked value to your (hidden...) form field.
It's possible in Firefox, because it lets you define a background-image
for option
elements in CSS. AFAIK only Firefox allows this though.
You could use a jQuery plugin. A Google search gave me this plugin for example.
This is not possible using regular HTML and CSS. The DTD does not allow it.
精彩评论