Home/ Questions/Q 8473157
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T17:16:15+00:00

Here is a very simply jsFiddle to demonstrate my problem: http://jsfiddle.net/ryandlf/mSmUv/4/ When an element

  • 0

Here is a very simply jsFiddle to demonstrate my problem: http://jsfiddle.net/ryandlf/mSmUv/4/

When an element has a top padding or margin and it sits on the first line within a div, the div does not respect that padding or margin and push the element down. In most cases this isn’t an issue, but for example, if I have a button that has a top border and padding the top of the border will be cut off because the div is not taking into consideration the padding value.

Is there a workaround for this other than just blindly setting margins or padding on every container div element and hoping I have added enough to account for any internal element that might be affected?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    your link with class button is not a block element, it is inline element. Change this default behaviour by adding dispaly: block to it and it will work as expected. Proof available on jsfiddle.

    So to sum up, the problem is not with the div – it is the problem with css – inline elements ignore margin and padding because they cannot ‘reserve space’.

    UPDATE: To answer your comment, here is the solution you might be looking for

    • 0