Советы по CSS, которые вы вряд ли найдете в самоучителях

Расчет вертикальных padding от ширины, а не от высоты вполне очевиден. Точнее понятно почему не сделали «по-правильному». Допустим, если бы он считал от высоты. Как можно посчитать процент от высоты, если рассчитанное значение снова влияет на высоту. Скажем высота блока 100px и мы поставили padding-top: 20%. При стандартной блочной модели высота блока должна была бы стать равной 120px, но тогда padding стал бы равным 24px (20% от 120px). Теперь получаем, что блок должен бы уже стать высотой 124px. И снова вызывает пересчет паддинга и так до бесконечности (на самом деле мы будем стремиться к какому то числу, но не достигать его)