I'm carrying out a website within the joomla16 framework, utilizing a modified beez5 template. I get an unusual derive from IE. Chrome shows the website because it is intended, however IEE is adding a padding I can not appear to locate anywhere. I have used IE dev tool versus. the Chrome element inspector to locate this discrepancy, but it is nowhere found.
The website is http://18.104.22.168/joomla16/
Any help or suggestions could be happily appreciated.
I'm testing with IE 8..(7601)
I appear to possess found something within the IE dev tool. While using layout pane you will get the calculated dimensions from the different elements.
The div id="header-image" includes a size 1050x137, whereas the a categoryEqualsInchlogo design" and also the img class="logo design" have a size 1050x134.
This could take into account the three pixel line, however i aren't seeing where it's produced.
Case a guess: IE might run your website in eccentricities mode, where it looks like the behavior of IE6. To disable eccentricities mode, you need to specify a proper doc type. The right doctype for HTML5 is for instance:
It appears I've discovered the answer, although it is a strange one.
By setting height of div id="header-image" to some fixed 134px ( header-image) the issue is solved, and also the results are identical in IE and Chrome.
However, I'm not sure why IE is adding a 4 pixel difference within the element, once the absolute height isn't joined.