Вертикальное расположение внутри контейнера минимальной высоты

Question

Недавно было обнаружено, что элемент относительного расположения внутри контейнера с заданной «минимальной высотой», но без «высоты», не может быть расположен вертикально, только горизонтально.Я ошибся?¿Есть ли причина для этого?¿Обходные?Изменить: случай% min-высота;Вот пример:

<div style="position:relative; width:100%; min-height:100%; background-color:pink;">
        <div style="position:relative; top:30%; left:30%; width:700px; height:500px; background-color:yellow;"></div>

"top: 30%" игнорируется

Answer 1

Да, вы можете, вы можете использовать flexbox для центрирования вашего относительного div внутри вашего контейнера.

<div class="container">
  <div class="center"></div>
</div>

.container {
  min-height: 300px;
  background-color: red;
  display: flex;
}

.center {
  width: 100px;
  height: 100px;
  background-color: blue;
  margin: auto;
  position: relative;
}