Utilizing the jumbo tron to display a hero image of psd, there seems to be a gap at the bottom that I have tried to adjust with margin-bottom: 0px without success.
.jumbotron
{
background-image: url(image/background.png);
background-repeat: no-repeat;
-webkit-background-size:cover;
-moz-background-size:cover;
background-size: cover;
padding: none !important;
padding-bottom:none !important;
margin-bottom: 0;
} <div class="navbar navbar-inverse navbar-fixed-top">
<div class="Brand">Dipped</div>
<div class="navbar-inner">
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Home</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#works">Works</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</div>
<div class="jumbotron">
<div class="jumpbotron-inner text-center">
<h1>We create well-designed websites</h1>
<p>Class aptent taciti sociosqu ad litora torquent per conubia nostra.</p>
<p>
<a class="btn btn-primary btn-large">
Get Started
</a>
<a class="btn btn-primary btn-large">
Learn More
</a>
</p>
<img src="image/browser.png">
</div>
</div>
</body>
</html>https://i.stack.imgur.com/tLLHV.jpg
However, there is a noticeable margin between the browser image and the bottom of the jumbotron.
Using bootstrap 3.3.7 as a reference for this project.