Removing body margin in CSS

html css margin space
p3nchan picture p3nchan · May 13, 2015 · Viewed 128.9k times · Source

I'm new to web development, and met a problem when removing margin of body.

There's space between the very top and "logo" There's space between the very top of the browser and "logo" text. And my code is here on jsbin.

Is body { margin: 0;} wrong if I'd like to remove the space?

Answer

andeersg picture andeersg · May 13, 2015

I would say that using:

* {
  margin: 0;
  padding: 0;
}

is a bad way of solving this.

The reason for the h1 margin popping out of the parent is that the parent does not have a padding.

If you add a padding to the parent element of the h1, the margin will be inside the parent.

Resetting all paddings and margins to 0 can cause a lot of side effects. Then it's better to remove margin-top for this specific headline.

Related questions

How to align two elements on the same line without changing HTML

I have two elements on the same line floated left and floated right. <style type="text/css"> #element1 {float:left;} #element2 {float:right;} </style> <div id="element1"> element 1 markup </div> <div …

Read More
Why can't I center with margin: 0 auto?

I have a #header div that is 100% width and within that div I have an unordered list. I have applied margin: 0 auto to the unordered list but it won't center it within the header div. Can anybody please tell me …

Read More
CSS Cell Margin

In my HTML document, I have a table with two columns and multiple rows. How can I increase the space in between the first and second column with css? I've tried applying "margin-right: 10px;" to each of the cells on …

Read More