Hello, I'm struggling as an amateur to figure out why the #sponsorBar div is not displaying below the navbar div. Any assistance would be greatly appreciated. Please let me know if you require more information.
body {
background-color:black;
margin:0;
padding:0;
}
#navBar {
position:fixed;
float:left;
background-color:white;
text-align:center;
height: 50px;
width:100%;
margin:0;
padding:0;
top:0;
}
#navList {
display:inline-block;
list-style-type: none;
margin: 0;
padding: 0;
background-color:white;
}
#navList li {
float:left;
}
#navList li:nth-child(1) {
border-left: 0;
}
#navList li:nth-child(3) {
margin-right: 100px;
}
#navList li:nth-child(5) {
margin-left: 100px;
}
#navList li:nth-child(7) {
border-right: 0;
}
#navList li a {
display:inline-block;
font-family:'Helvetica Neue', Helvetica, sans-serif;
font-weight:bold;
text-decoration:none;
color:black;
font-size:1.2em;
vertical-align:-17px;
margin: 0;
padding: 0;
height:50px;
}
#navList li:hover {
background-color: black;
}
#navList li:hover a {
color:white;
}
.navImage {
float:left;
display:block;
margin:0;
padding:0;
max-height: 50px;
}
.navImage:hover {
background-color: white;
}
.navListItem_left {
border-left: 1px solid black;
height: 50px;
width:100px;
}
.navListItem_right {
border-right: 1px solid black;
height: 50px;
width:100px;
}
#sponsorBar {
clear:left;
position:relative;
display:block;
background-color:white;
height:100px;
width:80%;
margin:100px;
}<div id="navBar">
<ul id="navList" class="navListItem">
<li class="navListItem_left">
<a href="index.html">Home</a>
</li>
<li class="navListItem_left">
<a href="teams.html">Teams</a>
</li>
<li class="navListItem_left">
<a href="articles.html">Articles</a>
</li>
<li>
<a href="/index.html">
<img src="img/simplify_black_transparent_500x500.gif" class="navImage"/>
</a>
</li>
<li class="navListItem_right">
<a href="menu5.html">Menu4</a>
</li>
<li class="navListItem_right">
<a href="about.html">About Us</a>
</li>
<li class="navListItem_right">
<a href="partners.html">Partners</a>
</li>
</ul>
</div>
<!--Sponsor Div-->
<div id="sponsorBar">
<p style="color:red;">TEST</p>
</div>