абсолютно позиционированный элемент перемещается даже в относительном контейнере

Question

Я googled и googled и проверял stackoverflow и actualy Я нашел ответ, это логично, и я это понимаю, но это не работает для меня! Абсолютные позиционированные divs перемещаются при изменении размера браузера. Я помещал их в относительный контейнер и все еще двигался. Очевидно, что я делаю неправильно, но мне нужна помощь в поиске того, что это такое.

<div id="wrapper"> 
    <div id="logo"> 
     <img src="zgodalogotyp.png" width="240px"> 
    </div> 
    <div id="line"></div> 
    <div id="box"></div> 
</div> 

и CSS:

#wrapper { 
    height: auto; 
    margin-top: 0; 
    margin-bottom: 50px; 
    margin-left: 30px; 
    margin-right: 30px; 
    padding: 10px; 
    background-color: white; 
    position: relative; 
    background-position: center; 
    z-index: 0; 
    clear: both; 

} 
#box { 
    position: absolute; 
    margin-top: 265px; 
    right: -30px; 

    width: 400px; 
    height: 250px; 
    background-color: #624051; 
    z-index: 10; 
    clear: both; 
} 
#line { 
    margin-top: 254px; 
    height: 56px; 
    width: 455px; 
    background-color: #000000; 
    opacity: 0.2; 
    z-index: 11; 
    right: -30px; 
    position: absolute; 
} 

есть еще много дивов в своем коде, что у меня есть эта проблема с, но я использовал ту же схему. заблаговременно

Answer 1

Не знаю, чего вы пытаетесь достичь, но я попытаюсь угадать;) - все перемещается, потому что относительный позиционный элемент не имеет указанной ширины, и вы позиционируете эти абсолютные элементы для правильно. Возможно, настройка ширины контейнера решает вашу проблему. Или просто позиционирование абсолютных элементов влево, а не вправо.