Вот мой сайт, в первую очередь.
Вы заметите, что под разделительной полосой в середине страницы есть три столбца, один с формой, один с текстом, другой со ссылками.
Теперь измените размер окна, чтобы оно стало немного меньше, и правый div опустится до следующей строки.
Есть ли способ просто не отображать это? Таким образом, divs будет корректироваться (у меня есть разметка) до точки, где они не поместятся, тогда, вместо переноса div на следующую строку, он просто не будет отображаться?
Вы также можете добиться этого только с помощью CSS.
Просто присвойте следующие атрибуты CSS # row4:
#row4 {
min-width:1202px; /* the exact value depends on the sum of the width of your 3 column boxes */
overflow:hidden;
}
Это немного отличается от вашего предполагаемого решения, так как правый квадрат останется частично видимым при определении размера окна и не исчезнет полностью.
Имейте в виду, что min-width не будет работать в IE6. Однако существует несколько способов эмуляции свойства min-width, если вам нужно поддерживать старые IE:
Вы можете предоставить им обертку div с минимальной шириной и заставить ее использовать горизонтальную полосу прокрутки, если она становится слишком малой. Приятная вещь об обертке div - вы также можете дать ей максимальную ширину и не позволять вещам становиться неуклюжим на супер огромных мониторах.
Я не поклонник горизонтальных полос прокрутки, но он полностью удаляет контент.
Хорошо, вот что вам следует делать
Оберните все три плавающих деления на родительский div, что-то вроде этого
<div id="parent">
<div class="form">......</div>
<div class="text">......</div>
<div class="links">.....</div>
</div>
Теперь, чтобы решить вашу проблему, укажите фиксированную высоту в parent div как
#parent { height:400px;clear:both; }
Вам нужно будет использовать Javascript для получения ширины окна просмотра, а затем изменить свойство отображения div, которое будет отображаться на дисплее: none, чтобы оно не отображалось, когда ширина браузера слишком мала.