Margin-top to a block affects to the container div

HTML & CSS
1

Hi,

I have this page.

I want to give a margin-top to the logo, but when i do it, the div that contains the logo goes also down, why?

Regards

Javi

2

Yes, as Stomme poes says, padding is an alternative to a border.

3

I use padding on a container when margins on the first child do this junk to me. The exception is when only one child needs to be pushed down… and the others need to stay hugging the top. In that case, I’d either do ralph’s solution (with a transparent border nobody can see yay) or 1px padding or whatever to get around the collapse.

4

just wondering, wouldn’t adding a padding to the container div also help, i.e. move some of the pixels of the img margin to div paddings.

5

Hi Javi,

Margins hang out of their containers by default (explained here).

One easy solution is to place a 1px white border on the top of the container, like so:

#logo {
    border-top: 1px solid #fff;
}

Hope that helps. :slight_smile: