Почему позиционируемый div не расширяется?

У меня есть div с position:absolute, left:0, right:0; widht:100%. Это нормально с моим кодом. Но когда я добавил еще один div, который у него есть width:2000px;, моя первая ширина div не расширяется. Не могли бы вы предложить мне.Почему позиционируемый div не расширяется?

Это мой пример. http://jsfiddle.net/vYhv4/

Благодаря

источник

2012-03-09 Pavan Kumar

Как выглядит css? нам трудно помочь, если мы не знаем, что у вас есть в настоящее время. Если у вас нет переполнения: указанный в css попробуйте установить его. – Brian

Свойство position:absolute позиционирует элемент относительно элемента своего предка, в вашем случае это body документа, который не является шириной вашего класса .displayElement. Одна вещь, которую вы можете сделать, чтобы исправить это, состоит в том, чтобы содержать как ваш класс .displayElement, так и ваш абсолютно позиционированный div, .box, внутри контейнера, который является чистым, который действует как предок вашего .box div, расположенного родственника.

Как так:

HTML

<div class="element-container"> 
    <div class="box">test</div> 
    <div class="displayElement"> 
     flash slider comes here 
    </div> 
</div>

CSS

.element-container:before, .element-container:after { 
    content:""; 
    display:table; 
} 

.element-container:after { 
    clear:both; 
} 

.element-container { 
    zoom:1; /* ie hasLayout fix */ 
    position:relative; 
    display:inline-block; 
}

Demo

источник

2012-03-09 14:44:12

Ваши решения превосходны. но еще одно сомнение ... когда я применил к ширине: 500 пикселей, переполнение: авто; для элемента-контейнера, почему снова окно div не расширяется в этом случае? –

@PavanKumar Вы должны помнить, что div 'element-container' действует только как контейнер-контейнер, который расположен относительно, поэтому ваш div' box' может расширить ширину вашего div_ displayElement', поэтому там, где вы действительно должны добавить ширина находится на этом элементе 'displayElement'. Если вы установите ширину в div контейнера, это ширина, которую будет выбирать div 'box'. –

так, в этом случае мы не можем что-то делать? –

Первый DIV будет только расширяться по ширине видимой области, он не будет расширяться прошлое, пока не указать ширину, которая больше.

источник

2012-03-09 14:42:46

Я предполагаю, что это потому, что .box выравнивается к телу. Тем не менее, тело имеет ширину 100% и не растет, когда .displayElement становится шире, чем область просмотра.

Есть ли причина, по которой вы не можете установить ширину .box на 2000 пикселей?

источник

2012-03-09 14:44:01 Bram

это .бога назначение отличается для моего требования. Поэтому я не могу дать 2000 пикселей. На самом деле я не буду давать 2000px. это берет с моей картинкой. Некоторые фотографии могут иметь от 200 до 3000 пикселей. –

Возможно, ваш родительский контейнер имеет набор ширины, который меньше вашего элемента 2000px. Я думаю, поскольку у вас есть ваш div, абсолютно позиционированный с левой и правой 0, ваша ширина будет шириной вашего родительского контейнера. width: 100% не расширят ваш контейнер до ширины дочерних контейнеров, а к родительскому.

источник

2012-03-09 14:46:15 ddbuy

Почему позиционируемый div не расширяется?

ответ

Смежные вопросы