Bug 1309522 - Username and documentation overlaps with OPENSHIFT ORIGIN logo on /console page for IE11
Summary: Username and documentation overlaps with OPENSHIFT ORIGIN logo on /console pa...
Keywords:
Status: CLOSED CURRENTRELEASE
Alias: None
Product: OKD
Classification: Red Hat
Component: Management Console
Version: 3.x
Hardware: Unspecified
OS: Unspecified
medium
low
Target Milestone: ---
: ---
Assignee: Robb Hamilton
QA Contact: Yadan Pei
URL:
Whiteboard:
Depends On:
Blocks:
TreeView+ depends on / blocked
 
Reported: 2016-02-18 02:23 UTC by Yadan Pei
Modified: 2016-05-12 17:14 UTC (History)
2 users (show)

Fixed In Version:
Doc Type: Bug Fix
Doc Text:
Clone Of:
Environment:
Last Closed: 2016-05-12 17:14:53 UTC
Target Upstream Version:

Attachments (Terms of Use)
IE11Console (33.31 KB, image/png)
2016-02-18 02:23 UTC, Yadan Pei 		no flags Details
IE11HomeLink (17.16 KB, image/png)
2016-02-18 02:24 UTC, Yadan Pei 		no flags Details
IE11Overlap (36.41 KB, image/png)
2016-02-19 03:35 UTC, Yadan Pei 		no flags Details
View All Add an attachment (proposed patch, testcase, etc.)

Description Yadan Pei 2016-02-18 02:23:15 UTC 
Description of problem:
On IE11, when open /console page,user-dropdown element and documentation dropdown overlaps with OPENSHIFT ORIGIN logo on the left upper corner

Version-Release number of selected component (if applicable):
devenv-rhel7_3449
IE11

How reproducible:
Always

Steps to Reproduce:
1.Login to openshift web console

Actual results:
1.username and documentation overlaps with ORIGIN logo on /console page, refer to attachment

Expected results:
1. /console page should display well

Additional info:
Firefox44, Chrome47, Edge25, Safari9 works fine
Comment 1 Yadan Pei 2016-02-18 02:23:45 UTC 
Created attachment 1128124 [details]
IE11Console
Comment 2 Yadan Pei 2016-02-18 02:24:26 UTC 
Created attachment 1128125 [details]
IE11HomeLink
Comment 3 Robb Hamilton 2016-02-18 19:08:49 UTC 
Ya, I am unable to reproduce this bug in IE11.  I can, however, reproduce it in IE10.  Can you confirm that you're able to reproduce in IE11?
Comment 4 Yadan Pei 2016-02-19 03:35:53 UTC 
Created attachment 1128408 [details]
IE11Overlap
Comment 5 Yadan Pei 2016-02-19 03:36:18 UTC 
Add a screenshot to show what happens on my side
Comment 6 Robb Hamilton 2016-02-19 13:49:17 UTC 
Ah ha!  This bug is occurring because the CSS builds are different.

CSS served over port 8443:

@media (min-width: 768px) {
  .components .components-panel .component-block .component.meta-data {
    -moz-flex: 1 1 0%;
    flex: 1 1 0%;
  }
}

CSS served over port 9000:

@media (min-width:768px){.components .components-panel .component-block .component.meta-data{-webkit-flex:1 1 0;-moz-flex:1 1 0;-ms-flex:1 1 0;flex:1 1 0}}

Both are problematic.  8443 is missing the additional prefixed values.  The latter is missing the "%" unit declarations required to overcome an IE10-11 bug (see https://github.com/philipwalton/flexbugs#workaround-3).  

Jessica, I've yet to fully understand the Gruntfile.  Can you help?
Comment 7 Robb Hamilton 2016-02-19 22:05:49 UTC 
https://github.com/openshift/origin/pull/7475 should resolve this bug.
Comment 8 Yadan Pei 2016-03-01 05:53:11 UTC 
checked against devenv-rhel7_3568, issue is fixed

move to verified
Note You need to log in before you can comment on or make changes to this bug.