У меня есть элемент со статическим положением и он не может его изменить (потому что все это сломается). И мне нужно добавить дочерний элемент с относительным положением к нему. Есть ли способы сделать это?Есть ли способ установить позицию элемента относительно статического родительского элемента?
Чтобы добавить относительный ребенок, просто создайте относительный контейнер и добавьте в него свой дочерний элемент.
<div class="static">
<div class="relative">
<div class="child"></div>
</div>
</div>
.static {
border: 1px solid #000;
height: 200px;
position: static;
width: 200px;
}
.relative {
position: relative;
height: 100%;
width: 100%;
}
.child {
position: absolute;
left: 50%;
top: 50%;
background-color: #f00;
height: 50px;
width: 50px;
transform: translate(-50%, -50%);
}
Я создал пример для вас: http://jsfiddle.net/7L6bgruh/
Элемент с position: static является не -позиционный. Вы не можете позиционировать элемент относительно другого элемента, который сам не расположен, даже если этот элемент служит в качестве его содержащего блока в обычных обстоятельствах.
Добавление 'позиции: relative' ребенка статически позиционируемый элемент не будет делать * vitually ничего * само по себе. Непонятно, что вы пытаетесь сделать. Вопросы, требующие помощи кода, должны содержать кратчайший код, необходимый для его воспроизведения ** в самом вопросе **. См. [** Как создать минимальный, полный и проверенный пример **] (http://stackoverflow.com/help/mcve) –
Да. Но важно помнить, что ребенок всегда будет относиться к родительскому. Было бы проще помочь, если вы сообщите нам, каков ваш ожидаемый результат. Что вы хотите сделать на странице? – Szandor