CSS: плавающие два элемента div со 100% шириной за пределами экрана? - PullRequest
Новая
       18

CSS: плавающие два элемента div со 100% шириной за пределами экрана?

5 голосов
/ 07 сентября 2011

Я помню, что задавал этот вопрос некоторое время назад, но я не могу найти его снова! Я искал, но не могу найти решение, которое искал.

Допустим, у меня есть два элемента с шириной 100%, плавающих рядом друг с другом. Поскольку они занимают всю ширину экрана, им больше не остается места для плавания, и поэтому второй div появляется ниже первого. Я хочу, чтобы второй div продолжал плавать вне экрана рядом с первым.

Я думаю Решение, которое я получил, состояло в том, чтобы установить свойство display на что-то другое, но я не совсем уверен.

Есть предложения?

Ответы [ 3 ]

5 голосов
/ 07 сентября 2011

Полагаю, вам понадобится контейнер и установите ширину контейнера на 200%.Два внутренних блока с шириной 50% поместятся внутри. 

#container_div{ width:200%}
.inner_div {width:50%}
0 голосов
/ 09 ноября 2011

дают 50% ширины обоим поэтому они занимают 100% ширины вместе

0 голосов
/ 07 сентября 2011

Вы можете расположить их абсолютно. 

<body style="padding:0; margin:0">
    <div style="width:100%; position:relative;">
        <div style="width:100%; height:100px; background:#f90; position:absolute; top:0; left:0;">COLUMN1</div>
        <div style="width:100%; height:100px; background:#f00; position:absolute; top:0; left:100%;">COLUMN2</div>
    </div>
</body>

Они расположены абсолютно в пределах относительно позиционированного родителя.

Затем вы переключаетесь между ними, просто переключаете левые значения от 0 до 100% соответственно.

  • высоты и цвета фона просто чтобы увидеть, что происходит:)
...