Whenever I format a website according to a PSD file,
I always wonder if the space should be from the top element or the bottom one.

So if I have 2 elements that are seperated by some space, I normally choose
the top one, but I can't find a real reason not to choose the one on the bottom.

Any ideas?

  • 2
    Could you edit your question to include a simple code example that shows the two elements you're trying to lay out? It's hard to tell exactly what you're asking at present.
    – Nick
    Jul 7, 2011 at 14:31

2 Answers 2


I would typically add it to the upper element as padding-bottom:10px (or whatever whitespace size you need.

I find that I typically want "any content after this" to be a certain distance away. very rarely do I find the reverse ideal. (although its an easy modification if needed)

  • 2
    Be also aware of margin-collapsing, which allows to add the space to both elements.
    – feeela
    Jul 7, 2011 at 23:34

If it's always the same two elements as siblings (for example, a header div followed by a menu div at the top of each page), then there is no difference between adding margin-bottom (or padding) to the top vs. adding margin-top to the bottom.

OTOH, if the elements in question sometimes appear elsewhere in the document (for example, an H2 can be an article title followed by a byline in one place or a subheading followed by a paragraph elsewhere), then the answer will depend on how you need them to behave in each of the places.

Not the answer you're looking for? Browse other questions tagged or ask your own question.