The carousel is not touching the navbar as you can see. I would like to remove the margin in between it. I've tried using negative margins, they don't seem to work. Anyone here that can help me? http://i.stack.imgur.com/1htJM.png
<!DOCTYPE html>
<html>
<head>
<title>AwakenNetwork</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href = "css/bootstrap.min.css" rel = "stylesheet">
<link href = "css/styles.css" rel = "stylesheet">
</head>
<body>
<div id="wrap">
<div class = "navbar navbar-default">
<div class = "container">
<a href = "#" class ="navbar-brand">AwakenNetwork</a>
<button class = "navbar-toggle" data-toggle = "collapse" data-target = ".navHeaderCollapse">
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
</button>
<div class ="collapse navbar-collapse navHeaderCollapse">
<ul class = "nav navbar-nav navbar-right">
<li class = "active"><a href = "#"><span class="glyphicon glyphicon-home"></span> Home</a></li>
<li><a href = "#"><span class="glyphicon glyphicon-bullhorn"></span> Forums</a></li>
<li><a href = "#"><span class="glyphicon glyphicon-gift"></span> Vote</a></li>
<li><a href = "#"><span class="glyphicon glyphicon-tower"></span> Staff</a></li>
<li><a href = "#"><span class="glyphicon glyphicon-book"></span> Rankings</a></li>
<li><a href = "#"><span class="glyphicon glyphicon-shopping-cart"></span> Store</a></li>
</ul>
</div>
</div>
</div>
</div>
<div style="height: 365px; background: url('https://dl.dropboxusercontent.com/s/246mjb1z7mahfe2/img1.jpg'); position: relative">
<div class="carousel-caption" style="bottom: 15px">
<h1 style="font-size: 100pt">Awaken Network</h1>
<h1>Be Awakened..</h1>
</div>
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
