Page MenuHomePhabricator

div.navbar-inner obscures content on Internet Explorer 10
Closed, ResolvedPublic

Description

Default view (div.navbar-inner not hidden)

On http://korma.wmflabs.org/, the div.navbar-inner element (the WMF logo element which has the orange-ish background) obscures quite a lot of the page on Internet Explorer 10, as the screenshots prove.


Version: unspecified
Severity: minor
OS: Windows 7
Platform: PC
URL: http://korma.wmflabs.org/browser/top.html

Attached:

DefaultView.png (730×1 px, 72 KB)

Details

Reference
bz53635

Event Timeline

bzimport raised the priority of this task from to Medium.Nov 22 2014, 2:10 AM
bzimport set Reference to bz53635.

Created attachment 13207
And this is what the same page looks like with div.navbar-inner manually hidden

Attached:

ViewWithNavbarInnerHidden.png (728×1 px, 65 KB)

00:07] <MatmaRex> ashley: it looks like this in real browsers: http://i.imgur.com/MLg3nV7.png
[00:08] <MatmaRex> it has img {max-width:100%}. that's probably why ie breaks
[00:08] <MatmaRex> the image itself is 200px wide
[00:08] <MatmaRex> with width=50 on the <img> element
[00:08] <MatmaRex> which is stupid in its own regard

The offending CSS property seems to be the height: auto; on the img element in http://korma.wmflabs.org/browser/VizGrimoireJS/vizgrimoire.css. After removing the img styles provided by http://korma.wmflabs.org/browser/VizGrimoireJS/bootstrap/css/bootstrap.css (via IE's built-in developer tools), only the three styles defined in vizgrimoire.css apply and removing the height: auto; provided by that file fixes this issue and makes the WMF logo display as it does on MatmaRex's screenshot.

Qgil lowered the priority of this task from Medium to Low.Jan 8 2015, 11:25 AM

http://korma.wmflabs.org/ has changed a lot since this bug was reported. @ashley, can you check whether this problem still occurs in IE, please?

@Qgil: http://korma.wmflabs.org/ looks good on Internet Explorer 11 under Windows 7. I don't have access to IE10 myself, so I used browserstack.com's screenshot utility, and here's what the site looks like on Windows 7 under various, pre-11 Internet Explorers:

So yes, this particular bug has been "fixed" by the various layout changes, but it's still somewhat worrying that the site looks more or less off on older IEs. Internet Explorer is, as we know, one of those things we just gotta live with, and end-users don't necessarily run bleeding-edge versions of their browser(s), either because they can't upgrade or don't know how to upgrade. Food for thought, I guess.