Certain pages display terribly in IE generally, what is the best approach to solving these issues?
相关问题
- Views base64 encoded blob in HTML with PHP
- Is there a way to play audio on a mobile browser w
- HTML form is not sending $_POST values
- implementing html5 drag and drop photos with knock
- Adding a timeout to a render function in ReactJS
you mean that in IE the Div's are smaller.Thats because in IE css border,margin are included in the width declared.So, if you have given a div width of 100px and a margin of 10px both sides then in IE the actual visible width of this div will be 100-10-10=80px.To solve the problem you can use child css decleration. Considering our example if you want to show this div 100px width in both the browsers do the following
Using this you can uniform the width of your Divs across both IE and non-ie browsers
You forgot to add a doctype, so your page is in Quirks Mode.
Add this (the HTML5 doctype) as the very first line:
and it should look better.
Although, changing the Document Mode manually (using Developer Tools; hit F12), it still doesn't look right. There are evidently other problems with the page.
The most pertinent problem (after escaping Quirks Mode) is this:
Internet Explorer is not showing any background colour because you forgot the
#
before the colour. (And you havepadding; 0
, with a;
instead of:
)This will work:
But you shouldn't be using inline styles in the first place..
This would be better:
with CSS in your stylesheet:
Instead of pointing out the reason for each element's different way of rendering in IE, I would strongly recommend not re-inventing the wheel each time you create a new page element.
Even in modern standards-complaint browsers, CSS can be very unpredictable, so it's better to use bullet-proof snippets of code from trusted sources such as
CSS the Missing Manual
CSS the Definitive Guide
CSS Cookbook
Start out with working blocks of HTML/CSS and modify them to your liking and test cross-browser from there. The whole process will be much less frustrating.