I have made my website in a responsive way
It works quite nicely in the modern browsers but I have tried it in internet explorer 9 and it falls apart.
The main drawback is a div called phonemenu (or something like that) which appears when the screen goes below a certain width… 568px
I have not got regular access to IE9 or IE8 so cannot test these things out.
How could I get rid of this div which appears in IE9 even when its not wanted
I have thought of the following… would they work?
- set the width and height of the div to 0px by default
- set the visibility to none (can you do that with a div)
Any other solutions?
I found this - would it work
<!–[if gt IE 8]>
Phone menu content here
How would I write the syntax for an all inclusive statement where the browser is either Not IE and if it is then its greater than IE9 … or can that not be done
IE9 is usually fine and its your lack of a doctype that is most likely causing problems because that will stop any modern css or media queries from working.
Add a doctype and test again and also fix this error.
<meta http-equiv="Content-Type" content="text/html; charset="utf-8">
You have an extra quote mark which will cause errors. It should be:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
If you want to support IE8 then you need to add media query support which can be done with this polyfill (although the code only works when online and not locally).
<!--[if lt IE 9]>
It may also be worth forcing strict mode in IE with this meta tag:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
If you are using html5 then don’t forget the shiv:
<!--[if lt IE 9]>
You can use Conditional comments to exclude a variety of browsers and the info you need is here but you will likely not need it if you have coded the page correctly as mentioned above.
Thats a great help. I never knew about that js fix for IE9.
I can get in a bit of a mess with html declarations as I don’t really understand them. I just cut and paste what I think is right.