Search code examples
stylesheetuser-agent

H3 being overwritten by user agent stylesheet but only for em


My H3 is being overwritten by user agent stylesheet when defining a font-size by em. When I use pixels its fine, its the em its not responding to:

* {margin:0;}

body{
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: #f8f8f8;
color: #636363;
margin: 0px;
}

p{margin: 15px 0; line-height:20px;}

h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; }

h1 { font-size: 3.929 em }
h2 { font-size: 2.072 em; text-transform: uppercase; }
h3 { font-size: 2.072 em; padding: 10px 0;}

h1 and h2 are working fine. Can anyone help me?

THanks


Solution

  • h1 { font-size: 3.929 em }
    h2 { font-size: 2.072 em; text-transform: uppercase; }
    h3 { font-size: 2.072 em; padding: 10px 0;}
    

    take away the spaces between the number and the 'em'

    h1 { font-size: 3.929em }
    h2 { font-size: 2.072em; text-transform: uppercase; }
    h3 { font-size: 2.072em; padding: 10px 0;}