CODEWITHSUNDEEP
htmlcssinternet-explorer-8html-select
ogelacinyc
ogelacinyc

Reputation: 1372

Why can't I change select option styling in IE8?

I wanna change font style in select-option box.

I have tested in IE6, chrome, Sapari.....it is working!

but it wasn't working in IE8

It did not working :

<select name="myselect">
  <option val="1" style="font-family: Nanum Gothic, sans-serif;">All</option>
  <option val="2" style="font-family: Nanum Gothic, sans-serif;">Name</option>
  <option val="3" style="font-family: Nanum Gothic, sans-serif;">Phone</option>
</select>

And It did not working :

<select name="myselect" style="font-family: Nanum Gothic, sans-serif;">
  <option val="1">All</option>
  <option val="2">Name</option>
  <option val="3">Phone</option>
</select>

IE8 have any bug about select-option tag?

Or It is normal?

Thanks.

Upvotes: 0

Views: 1710

Answers (1)

Frank Conijn - Support Ukraine
Frank Conijn - Support Ukraine

Reputation: 3190

I'm seeing a different cross-browser behavior. The option-styling method is not supported by IE8/9, Chrome18 (embedded in my editor) and FF30.

The select-styling method is supported by IE8/9 and Chrome18, but not by FF30. Test it for yourself with this demo. Its code: 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Demo</title>
</head>
<body>
    <select name="myselect1">
      <option val="1" style="font-family: sans-serif;">All</option>
      <option val="2" style="font-family: serif;">Name</option>
      <option val="3" style="font-family: sans-serif;">Phone</option>
    </select>

    <select name="myselect2" style="font-family: sans-serif;">
      <option val="1">All</option>
      <option val="2">Name</option>
      <option val="3">Phone</option>
    </select>

    <select name="myselect3" style="font-family: serif;">
      <option val="1">All</option>
      <option val="2">Name</option>
      <option val="3">Phone</option>
    </select>
</body>
</html>

Also, be aware that, like Niet The Dark Absol already implied in his comment, all styling is ignored by touchscreens. No matter which browser is used.

Upvotes: 1

Related Questions