Do you ever struggle with fixed navbars covering elements below them? I often encounter this issue and wonder how to add margin to the element below a fixed navbar.
I'm curious if there is a more sophisticated approach to solving this problem rather than using the <br>
tag or margin-top
.
Here's an example of the code:
HTML code :
<nav>
I AM NAVBAR
</nav>
<br><br>
<div>
</div>
CSS code :
* {
padding: 0;
margin: 0;
}
nav {
height: 50px;
width: 100%;
background: #444;
color: #fff;
text-align: center;
font-weight: bold;
font-family: verdana;
position: fixed;
top: 0;
left: 0;
}
div {
height: 500px;
width: 100%;
background: tomato;
}