Что означает 100% в CSS?

Амелия Ваттенбергер написала интерактивную статью про использование процентов в CSS — "What does 100% mean in CSS?".

В статье есть хорошие интерактивные примеры и краткое описание поведения процентов для разных свойств:

  • для height процент высчитывается относительно высоты родителя
  • для width — относительно ширины родителя
  • для top — относительно высоты родителя
  • для left — относительно ширины родителя
  • для margin-top — относительно ширины родителя
  • для margin-left — относительно ширины родителя
  • для padding-top — относительно ширины родителя
  • для padding-left — относительно ширины родителя
  • для translate-top — относительно высоты элемента
  • для translate-left — относительно ширины элемента

Очень прикольная статья. Советую почитать всем, кто хочет разобраться с процентами в CSS.

https://wattenberger.com/blog/css-percents

← На главную