Despite my efforts, I can't seem to eliminate the noticeable margin between the div and the edges of the screen.
<!DOCTYPE html>
<html>
<head>
<title>Test2</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="test2.css">
</head>
<body>
<div class="container-fluid" id="topBackground">
<h1>first</h1>
</div>
</body>
</html>
CSS:
#topBackground{
background-color:#310048;
height:500px;
float:auto;
margin:0 auto;
max-width:100%;
}