CSS file: http://pastebin.com/tBvGjhTX
HTML file: http://pastebin.com/r5YUTHgp
I have a div with following rules:
{
width: 75%;
margin: 5% auto;
}
Obviously works everywhere except Microsoft Internet Explorer 0.5 to Edge. While in every normal browser, box takes 75% of width and is centered horizontally. But Microsoft be like "screw that", and in Internet Explorer box takes 100% the width of the parent. Any other dependencies, removing them or keeping them doesn't change anything.
Add this to your stylesheet.
html, body { width: 100% }
Didn't work :(
According to your pastebin snippet you don't use a doctype. Is this also the case in your page?
Ah, good you reminded me, I added <!DOCTYPE html>.
However, that still does not solve the problem.
ok, I had to see it for myself so I've made a pen and tested it in IE11 on Windows7 and it just centers.
http://codepen.io/gentlemedia/pen/bpJzgO
Yes. I know it works with Internet Explorer 9+ normally. That's why I used it. Because I expected it to work, and it doesn't. I don't know what part does or does not work with it.
I don't know. But here's the link to download of the project file. Just open the file in Internet Explorer 11 and any other browser, you don't need to do anything, you'll notice the difference right away.
http://expirebox.com/download/752aa6f5c2cba1ea53f50ddcbdb9d406.html
okay, i've found the issue. In head.php you have a CSS reset and the css rule that sets the new HTML5 elements to display: block misses the main tag, so add the main tag there and it will center in IE. Below I've added the main tag so you can see what I'm talking about :)
article,aside,details,figcaption,figure,footer,header,hgroup,menu,main,nav,section{display:block}
Instead you can also add display: block in your own stylesheet of the main CSS rule.
Yep, it works.
Still pretty stupid though, every single browser does it, except IE... I don't know what I expected.
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.