Different browsers apply different default padding and margin to the <html> and <body> elements. If you don’t reset them, you’ll get unexpected whitespace that varies from one browser to another.

The fix is to simply zero them out at the top of your stylesheet:

html {
  padding: 0;
  margin: 0;
}

body {
  padding: 0;
  margin: 0;
}

This is the first rule I add to any new project.