Encountered an issue with my HTML code:
CSS:
.fixedmenu {
overflow: hidden;
background-color:rgb(153,0,51);
position: fixed; /* Ensures the navbar stays in place */
top: 0; /* Positions it at the top of the page */
width: 100%; /* Occupies full width */
font-size:2em;
}
#bodybox {
border:0px;
width:80%;
padding:0px;
margin-left: auto;
margin-right: auto;
background:red;
}
This is the HTML code within the body:
<div class="fixedmenu">
<div style="float: left;color:white;padding:0.5% 0% 0.5% 3%;">YggDrasil ||</div>
<div style="float: right;color:white;padding:0.5% 3% 0.5% 0%;"> || Login</div>
<div style="margin:0 auto; width:300px;color:white;padding:0.5% 0% 0.5% 0%;"> Welcome to YggDrasil. </div>
</div>
Everything was fine until this addition:
<div id="bodybox">
hi
</div>
After adding this, the margin of my top menu shifts to the right. How can I fix this?