CSS height is different in different browser

Question

The height of the blue bar in Safari and Chrome matches but in Firefox it is smaller. I would like to make them equal.

How do you detect the different height between different browser? It looks like you set the fixed height of your header. — Chen-Tai, Mar 28 '15 at 19:40
Yes I did. I opened the sites in all browsers and just putted them next to each other on my screen. — cyonder, Mar 28 '15 at 19:41
There was the website link but I removed. hexerei answered my question. Anyways thank you. — cyonder, Mar 28 '15 at 19:52

score 2 · Accepted Answer · answered Mar 28 '15 at 19:41

You could use a css hack for firefox:

@-moz-document url-prefix() { 
  header {
     height:50px; /* or whatever fits best there */
  }
}

This should only be interpreted by Firefox, while Opera, Chrome and Safari will use the default header {...} definition

1 Answers1