Remove left padding css

Question

I am trying to create a simple fixed navigation bar, but there is a white margin/padding down the left of the computer screen that I can't figure out how to get rid of.

CSS:

#menu-bar {
  padding-left: 0px;
  padding-right: 110px;
  margin: 0 auto;
  position: fixed;
  top: 0;
  width: 100%;
  color: #ffffff;
  height: 35px;
  text-align: center;
  padding-top: 15px;
  background-color: #333;
}
#menu-bar a {
  font-size: 14px;
  padding-left: 15px;
  padding-right: 15px;
  color: white;
  text-decoration: none;
}
#menu-bar a:hover {
  color: grey;
}

HTML:

<div id="menu-bar">
  <a href="#">Home</a>
  <a href="#">Home</a>
  <a href="#">Home</a>
</div>

Answer 1

In most major browsers, the default margin is 8px on all sides. It is defined in pixels by the user-agent-stylesheet your browser provides.

Some browsers allow you to create and use your own user-agent-stylesheet, but if you are developing a website, I would recommend staying away from changing this, since your users most likely will not have a modified stylesheet and would then see a different page than you do.

So, You can Reset/Normalize your css by adding this code:

html,
body {
  margin: 0;
  padding: 0;
}

But if you have a large project and want complete restting use normalize.css. It resets a lot of default values to be consistent across browsers. Good Luck ^_^!