IE8 and border css property in selected menus

I get really weird behavior when viewing a very simple piece of HTML in IE served by IIS. I find it difficult to explain this ...

Take the following html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <style> .iWantaBorder { border:red solid 1px ; } </style> </head> <body> <select class="iWantaBorder"> <option>1</option> </select> </body> </html> 

Save as html file on the desktop. When viewed in IE8, the selection menu has a red border.

Now copy the file to a website or virtual directory in IIS 5.1 or IIS6.

Go to this file in IE8 ... there is no red border.

Can someone tell me what is going on here? I really need a border in this menu. Thought it should be just to be honest, but I'm pretty much confused!

+3
source share
4 answers

try putting this in your HEAD tag:

 <meta http-equiv="X-UA-Compatible" content="IE=edge" > 

according to: http://msdn.microsoft.com/en-us/library/cc288325%28VS.85%29.aspx

+6
source

This may solve the problem:

  <style type="text/css"> .iWantaBorder { border:solid 1px red; display:inline-block; /*this should fix the bottom and right border*/ } </style> 

EDIT:

I tried to replicate the problem, you are right, it does not work on IE8, but if you are in IE8 / compatibility standard, it works on IE7 / QuirksMode standards, this is not so, I don’t know why it does not work on IE7 / Quirksmode standards.

Anyway, the workaround is to wrap the select element with another inline element and place the border on the shell element.

 <span class="iWantBorder"> <select> <option>Sample Option</option> </select> </span> 
+2
source

Try the following:

 border: 1px solid red; 

The concise syntax of borders should be weight, style, color. You seem to be wrong.

Putting them in the wrong order can put IE8 into a fad mode, which can lead to your problem.

-1
source

As with format controls, the border will not be displayed in IE8 if you want to create a custom flag to be displayed in all browsers in sequence.

Quirks mode is nothing more than a document type declaration, if you use strict.dtd to slow down a document type, it will always be displayed in standard mode.

Form controls (the Radio button, check box, selection box, and drop-down list) are always displayed depending on the operating system and browsers, unless you design special controls.

-1
source

Source: https://habr.com/ru/post/1313635/


All Articles