div плавающий левый

Я работаю на странице, где мне нужно много столбцов. Столбцы должны плавать влево, и столбцы под столбцом никогда не должны быть. (и если нет полосы прокрутки, просто сделайте столбцы, которые превышают экран, недоступный для доступа).div плавающий левый

Atm, мой второй столбец находится под моим первым инстантом рядом с ним.

<div id="container"> 

    <div id="menu"> 
    </div> 

    <div id="book"> 

     <div id="column1" class="column_n"> 
     </div> 

     <div id="column2" class="column_n"> 
     </div> 

    </div> 

</div>

CSS:

body { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    font-family: Verdana; 
    font-size: 20px; 

} 

.column_n { 
    width: 480px; 
    margin: 20px; 
    float: left; 
}

источник

2012-03-25 clankill3r

Они показывают бок о бок для меня. http://jsfiddle.net/hTJnX/. Просто убедитесь, что панель «Результат» достаточно широка, чтобы удерживать оба div. – xbonez

Позиция: относительная, поплавок влево (для сортировки столбцов слева друг к другу) переполнение: скрыто; для скрытия переполнения тела; auto: для упаковки с использованием той же длины, что и дочерний элемент.

источник

2012-03-25 13:23:19 Undefined

Я предполагаю, что вам нужно будет рассмотреть возможность использования свойств overflow-x и overflow-y), ознакомьтесь с w3Schools для получения дополнительной информации – Undefined

Это потому, что вам нужно найти правильные width и margin значения для дивы:

бывший:

http://jsfiddle.net/e9a7w/1/

и это как это должно быть, если ваш #book или body имеет ширину 960px

http://jsfiddle.net/e9a7w/2/

источник

2012-03-25 13:16:04 Alex

для плавающих влево работает, но высота column_n мала + для задачи прокрутки

источник

2012-03-25 13:19:45

Там не кажется, какие-либо проблемы с вашим кодом, кроме ширины div: http://jsfiddle.net/XrY8U/

Мне нравится прикладывать фоновый цвет к моему css при отладке или использовать инструменты chrome dev, чтобы увидеть размер элементов.

Скорее всего, у вас нет 2 * 480 + 4 * 20 = 1040 px ширины, доступных для ваших колонок. Обычно веб-сайты предназначены для размещения в 940 или 960 px.

источник

2012-03-25 13:20:06 almathie

Итак, если я правильно понял, у вас есть определенное количество столбцов, и должны отображаться только столбцы, которые вписываются в окно браузера.

Если вы можете установить высоту своих колонок (и ее контейнеров), вы можете использовать переполнение в div книги. Столбцы, которые не подходят, вообще не отображаются (испробованы в хроме), если вы сделаете браузер более широким, они могут вернуться. http://jsfiddle.net/rqdzK/1/

Если вы хотите, чтобы все столбцы отображались на любом экране, вы могли бы относительной ширины. Вы убедитесь, что все ширины составляют до 100% (хотя я считаю, что на IE 100% слишком много, так что возьмите 99,5 или около того). http://jsfiddle.net/MqFRB/2/

источник

2012-03-25 14:00:09 Joost

div плавающий левый

ответ

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