ItsADZZ
ItsADZZ

Reputation: 3

How do I remove the white margins around my div tags?

So I have been creating a very basic website with a header, nav, main container, and a footer. and I'm using the the viewport tag in my website.

My problem occurs when I set the width of the divs to 100%.

Here is my code:

#header {
  background-color: black;
  color: white;
  text-align: center;
  padding: 5px;
}
#nav {
  line-height: 60px;
  background-color: #FFFFFF;
  min-height: 60px;
  width: 100%;
  left: 0px;
  text-decoration: none;
}
#nav a {
  font-family: sans-serif;
  font-size: 25px;
  text-decoration: none;
  float: left;
  margin-left: 10px;
}
#section {
  min-width: 50%;
  min-height: 479px;
  float: left;
}
#section p {
  font-family: sans-serif;
  font-size: 20px;
}
#footer {
  background-color: black;
  color: white;
  clear: both;
  text-align: right;
  line-height: 40px;
  height: 40px;
}
#footer p {
  margin-right: 30px;
}

Is there something I need to change to get rid of the white edges around the div, I have tried things to get rid of it but none of them seem to work, any help would be greatly appreciated.

Upvotes: 0

Views: 4798

Answers (2)

16austin16
16austin16

Reputation: 17

are you talking about the white edges around the website then use

html, body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

Upvotes: 0

dippas
dippas

Reputation: 60563

bodyhas a default margin across browsers so you need to reset that margin.

so add this

body {
  margin: 0
}

Upvotes: 2

Related Questions