How to include images for <selection><option>?

11,323

In Firefox, you can use background-image but at least IE6 and IE7 don't support this. There is no pure html/css solution that will work consistently across all OS and browsers.

The only thing you can do is create the select box without images and then use Javascript to replace that box with a custom set of inputs, which will look like a select box but allow more customisation. Then if the user has Javascript turned off, they will be presented with the standard select box without images. Otherwise, they will see the pretty select box.

This will be quite complicated so I suggest you use a Javascript framework, such as Mootools and a plugin for this very purpose, such as MavSelectBox

Share:
11,323
Admin
Author by

Admin

Updated on June 04, 2022

Comments

  • Admin
    Admin over 1 year

    I have a list of countries displayed inside the select-tag option-tag tags, what I'd like to do is include the country's flag next to its name.

    I tried to insert img tags inside the select-option tags, it doesn't work.

    Please help

    Thank