%

Out of context: Reply #3

  • Started
  • Last post
  • 6 Responses
  • IRNlun60

    It's based on context.

    On an h2 with a base font size of 16px (1em), and a line-height of 18px (1.125em); setting a 10% top margin is equal to 10% of 16px or 1.6px. I prefer setting the margin on a base line-height to help in managing the vertical rhythm. So 18px top margin / 16px base font size = 1.125em.

    If you have a div with no set height, then the context is the total of all borders, margins, paddings, font size, line-height, total line numbers, etc... of children in parent. If you have a set height size for container then the height of the container is the context.

    10% of 64px height container = 6.4px

View thread