Hallo liebe Community,
ich war heute dabei eine Website zu schreiben und habe das Bootstrap Framework dazu benutzt. Nun, ich habe ein Bild mit der Höhe 417 Pixel eingefügt und darüber eine Navbar.
Jetzt ist da eine hässliche Lücke dazwischen und meine Frage wäre wie ich diese beheben kann.
Hier ist der Code:
HTML-Code:
<!DOCTYPE html>
<head>
<title>Website</title>
<meta charset="utf-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="pull-right">
<ul class="nav navbar-nav">
<li><a href="#">Log In</a></li>
<li><a href="#">Register</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
<div class="pull-left">
<ul class="nav navbar-nav">
<li><a href="#">Name</a></li>
<li><a href="#">Browse</a></li>
</ul>
</div>
</div>
</nav>
<header>
<div class="jumbotron">
<div class="container">
<img src="#">
</div>
</div>
</header>
</body>
</html>
Das Bild habe ich durch ein "#" ersetzt, war ein GitHub Logo mit der Höhe 417px.
Ich hoffe, dass ihr mir helfen könnt.