Div продолжает менять позицию с другим div ⇐ CSS

[Anonymous]

Я пытаюсь разместить SVG-изображение глаз на своей голове. У меня есть два отдельных SVG, которые я поместил в два отдельных блока. Несмотря на это, черно-белая направляющая для головы, которую я временно внедрил в свой код, чтобы показать, где должны быть глаза, не будет оставаться на месте и продолжает двигаться вместе с другим моим элементом div. Вот мой код:

Код: Выделить всё

.character {
/* position: relative;*/

}

.part {
position: absolute;
}

.head {
/*animation: float 2s ease-in-out infinite;*/
/*position: relative;*/
margin-top:30px;
}
.headcolor {
z-index: 1;
margin-top: -500px;
position: relative;
}
/*soon, i will have to temporarily disable the floating animation to position the eyes, mouth, and whatever*/

.headoutline {
z-index: 2;
position: relative; margin
width: 100%;
height: 100%;
}
/*
@keyframes float {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-5px);
}
}*/

Код: Выделить всё

Character Assembly

Вот что происходит, когда я открываю элемент проверки, а затем меняю верхнюю часть заголовка div:




Подробнее здесь: https://stackoverflow.com/questions/790 ... nother-div