Как установить поля или отступы в процентах от высоты родительского контейнера?

Я ломал голову над созданием вертикального выравнивания в css с использованием следующего

 .base {background-color: green; ширина: 200 пикселей; высота: 200 пикселей; перелив: авто; положение: относительное; } .vert-align {верхняя обивка: 50%; высота: 50%; } 
  
Содержимое здесь

Хотя это, казалось, сработало для этого случая, я был удивлен, когда я увеличил или уменьшил ширину моего базового div, вертикальное выравнивание было бы нарушено. Я ожидал, что когда я установлю свойство padding-top, оно будет принимать отступы в процентах от высоты родительского контейнера, который в нашем случае является базовым, но указанное выше значение 50 процентов рассчитывается как процент от ширина. : (

Есть ли способ установить отступ и / или поле в процентах от высоты, не прибегая к использованию JavaScript?

222
задан Bill-G 6 October 2019 в 15:38
поделиться