css - Pseudo-element size different on IE11 -


on live demo can see icon, several times bigger on ie 11 on other normal browser (ff/opera/chrome)

size must 12 em seen on code, differs quite bit between browsers:

.titlepanel [class^="icon-"]:before,  .titlepanel[class*="icon-"]:before{          font-size: 12em;     left: 79%;     line-height: 100%;     margin: 0 0 0 50px;     position: absolute;     z-index: -5000;   } 

as explained on 1 of many bugs on our beloved ie, pseudo-selectors apply multiple css rules when sizing, if there multiple selectors applied pseudo-selector:

https://connect.microsoft.com/ie/feedback/details/813398/ie-11-css-before-with-font-size-in-em-units-ignores-css-precedence-rules

to avoid have changed, seen on here, single rule pseudo-selectors contained on nav, , anothe single 1 contained on .titlepanel:

nav [class*="icon-"]:before, nav [class*="iconh-"]:before {       float: right;         font-size: 2em;         line-height: 50%;     margin: -5px 7px 0 0;     position: relative;}  .titlepanel [class^="icon-"]:before{          font-size: 12em;     left: 79%;     line-height: 100%;     margin: 0 0 0 50px;     position: absolute;     z-index: -5000;   } 

Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

jsf - How to ajax update an item in the footer of a PrimeFaces dataTable? -

django - CSRF verification failed. Request aborted. CSRF cookie not set -