Home/ Questions/Q 6744789
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T12:07:33+00:00

Consider the following HTML markup: <?xml version=1.0 encoding=UTF-8?> <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0

  • 0

Consider the following HTML markup:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <title>search/master</title>
        <style type="text/css">
            select{
                background-color: pink;
            }
            option{
                background-color: white;
            }
        </style>
    </head>

    <body>
        <p>
            <select>
                <option>one........</option>
                <option>two........</option>
            </select> 
        </p>
    </body>
</html>

Output on FF as follows: (Similar output comes on Chrome, Safari and Opera as well)

output on FF & other browsers

But output on IE as follows:

output on IE

What is the reliable and simple workaround to make the output on IE looks similar to other browsers?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If you definitely want to do this, you could use a 1px x 1px background image, and set the option to :transparent

    select{
    background: url(http://ajthomas.co.uk/stackoverflow-help/back.png);
}
option{
    background: transparent;
}

    See the jsfiddle example i have done for you

    • 0