Центрировать элемент с помощью position: relative

У меня есть меню, которое появляется при наведении курсора на абсолютно позиционированный div. Все элементы меню должны быть относительно позиционированы, потому что абсолютный div будет появляться несколько раз на странице и будет отображаться в нескольких размерах в одном экземпляре.

Как мне центрировать несколько элементов с помощью position: relative как по вертикали, так и по горизонтали, когда я не знаю размер родительского div?

Я знаю трюк position: absolute с отрицательными полями, но эта ситуация требует чего-то другого.

Вот пример код:

.OuterCase { 
  position  : absolute; 
  width     : 100%;  
  height    : 100%; 
  text-align: center;
}

.InnerItem  { 
   width  : 38px;
   height : 38px;
   display: inline-block;
}

У меня есть центрировать элементы по горизонтали; он получает немного неуловимую вертикаль.

59
задан Paul Roub 6 September 2019 в 22:36
поделиться