Форум Flasher.ru - проблема с переносом div с обтеканием в блочной верстке

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)

- HTML/DHTML/CSS/JS/VB (http://www.flasher.ru/forum/forumdisplay.php?f=66)

проблема с переносом div с обтеканием в блочной верстке

Добрый день, поискал как подобную проблему решают и ничего кроме "Вставь таблицу и не парься..." не нашел. Между тем проблема следующая:

Есть 5 блоков с обтиканием float:left. Все хорошо, но если я сужаю экран они начинают выстраиваться в столбик. Пробовал указать у родительского блока min-width. Команда отрабатывает, родительский блок перестает сужаться, но это не мешает дочерним 5 блокам выстаиваться в столбик.

Господа, если кто-нибудь знает способ запретить перенос div, поделитесь пожалуйста.

Спасибо!

смысл запрещать? кроссбраузерно запретить перенос div у которого указан float нельзя.
а то что "min-width не мешает дочерним 5 блокам выстаиваться в столбик" не более чем кривость рук.

Хороший комментарий, только Вы можете мне представить пример где min-width не мешает переносу блоков? Без кривости рук.

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

Странно, что min-width не помог. Попробуйте увеличить его значение, скажем, на 10рх.

Смотрите код ниже - все работает нормально. Но если min-width уменьшить хотя бы на 1рх, то последний блок начинает переноситься.
Здесь, похоже, этот прикол из-за включенных border'ов. 5 блоков по 2рх границ (1рх слева и 1рх справа) = как раз 10рх.
Да и если отображение границ отключить, то min-width:500рх становится достаточно ;)

Код:

<div style="width:100%; height:100%; border:1px solid black; min-width:510px;">

  <div style="width:100px; height:100px; border:1px dashed red; float:left;">1</div>

  <div style="width:100px; height:100px; border:1px dashed orange; float:left;">2</div>

  <div style="width:100px; height:100px; border:1px dashed magenta; float:left;">3</div>

  <div style="width:100px; height:100px; border:1px dashed green; float:left;">4</div>

  <div style="width:100px; height:100px; border:1px dashed blue; float:left;">5</div>

</div>

P.$. Если это не помогло, скиньте, плз, пример Вашего кода

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html><head>

<!-- <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> -->

<title>Untitled</title>

<style type="text/css">

</style>

</head><body><script type="text/javascript"></script>

<div style="min-width:310px;">

<div style="float:left;width:33%;border:1px solid red;"><div style="width:100px;">100px</div></div>

<div style="float:left;width:33%;border:1px solid red;"><div style="width:100px;">100px</div></div>

<div style="float:left;width:32%;border:1px solid red;"><div style="width:100px;">100px</div></div>

</div>

</body>

</html>

Цитата:

Вы можете мне представить пример где min-width не мешает переносу блоков? Без кривости рук.

вероятно напрягают переносы в ие. бо в прочих браузерах все нормально.
для этих случаев:
http://www.artlebedev.ru/tools/techn..._floats_in_ie/