Menu
You need to set the padding of the body element to zero. (The margin of the body element is meaningless; it'd represent a space outside the browser window!) As an aside, you don't need to set any CSS properties on the html element. body already contains everything that you'd want to set properties on.
You can remove this margin by setting the top and left margin to zero. Like the padding and border, the sizes of specific sides of the margin can be set using margin-left , margin-right , margin-top , and margin-bottom .
Remember, by default the body element has 8px of margin on all sides.
In most major browsers, the default margin is 8px on all sides. It is defined in pixels by the user-agent-stylesheet your browser provides.
This question have been asked before I'm aware of, but unfortunately still haven't found a solution. Even though I tried using their solutions.
My problem is that I can't get rid of the default 8px margin on around the body/html tag. It looks like that it doesn't even respond to the changes I put in between the curly brackets.
Html:
<div class="header">
Header123
</div>
<div class="nav">
<ul>
<li>HOME</li>
<li>PROJECT</li>
</ul>
</div>
<div class="main">
Article
</div>
<div class="footer">Footer</div>
CSS:
body,html {
margin: 0;
text-align: center;
background-color: blue;
}
.container
{
margin: 0;
background-color: red;
}
.header
{
text-align: left;
height: 90px;
background-color: green;
margin: 0;
}
.nav
{
float: right;
}
.nav ul
{
list-style: none;
height: 30px;
padding: 0px;
margin: 0px;
}
.nav ul li
{
margin: 10px;
}
.footer
{
height:40px;
}
Link: https://jsfiddle.net/RasmusGodske/yg2gsa0t/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With