Small margin left when div width defined to be 100%

I'm trying to make a fairly simple website and so far all I have is the top title bar. For some reason, there is a small margin on the left side. Any idea why and how to fix it?

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

.headbar {
  background-color: #117FF2;
  position: fixed;
  top: 0;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

<!-- language: lang-html -->

<div class='headbar'>
  <h1> Title </h1>
</div>

<!-- end snippet -->

I think it's probably caused by the default margin of the body element.

Try this:

body {
  margin: 0;
}