Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 671
  • Last Modified:

IE6 CSS issue with <select> tag

I've just discovered that the Select elements on my site display terribly in IE6. The input fields look fine, but none of the styles seem to apply to the Select elements. The CSS style is:

#customForm input, select
{
    padding: 6px;
    color: #949494;
    font-family: Arial,  Verdana, Helvetica, sans-serif;
    font-size: 14px;
    border: 1px solid #cecece;
    width: 400px;
}

Is there any way to fix this?

0
bumbling_fool
Asked:
bumbling_fool
1 Solution
 
Sudaraka WijesingheWeb Application ProgrammerCommented:
In IE we can't apply many of the CSS styles to SELECT element.
There are many JavaScript/jQuery based solutions that can be used as a replacement for SELECT. Try googling for one.
0
 
bumbling_foolAuthor Commented:
The style works in later versions of IE. Is it simply not possible in IE6?
0
 
Sudaraka WijesingheWeb Application ProgrammerCommented:
IE7 and earlier I believe. However I have faced some issues with select and file input element styling in IE8 also.
0
 
scrathcyboyCommented:
You cannot style the border in IE6, it doesn't work --
http://stackoverflow.com/questions/380037/ie6-ie7-css-border-on-select-element

And most of the other styling you have applied to a select element won't work in IE 6 --
http://www.google.com/search?num=30&q=CSS+Select+IE6
0
 
cloud-9Commented:
IE uses Windows selects, so they can't be styled very well in anything less than IE 8. When I have to support IE 6 or 7 with selects, I usually just have a special stylesheet that makes the font-size slightly large so the selects are at least the same dimensions.

Unless your sure more than 15% of your target audience is using IE 6, I would drop support for it. Even those statistics that favor IE show that less than 5% of total users use it. Thats the same percentage of users that don't use JS and/or Flash and have been ignored for years.

As mentioned there are plenty of JS solutions out there. Here are a couple:

http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/

http://www.kaktus.cc/weblog/1192629359/

http://www.articlediary.com/article/jquery-multiselect-plugin-with-themeroller-support-284.html

JQuery UI is here: jqueryui.com

However, IE 6 has no support of CSS 2, so even these JS solutions may not work very well.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now