float left wrapping parent вместо вложенных divs

пытается создать отзывчивый макет с нуля после нескольких часов, не получив его сразу с помощью бутстрапа. Моя цель состоит в том, чтобы обрезать плитки фиксированной ширины друг под другом, поскольку размер дисплея изменяется, но не обертывается под панелью div боковой панели, если по-прежнему достаточно ширины в div справа от боковой панели, чтобы показать их.float left wrapping parent вместо вложенных divs

В следующем примере я ожидаю, что плитки будут обертываться друг под другом и под разделом «фильтры и поиск», но не под «содержимым» div слева, пока ширина экрана не будет очень узкой , По мере того, как ширина начинает уменьшаться, все справа от боковой панели div появляется под ней, хотя есть много свободного места для начала стекирования. Какие-либо предложения?

Here is the code (no stylesheets to show everything here:) 

<div style="border:1px solid red;width:200px;float:left;" id="sidebar"> 
    <div>content1</div> 
    <div>content2</div> 
    <div>content3</div> 
    <div>content4</div> 
    <div>content5</div> 
    <div>content6</div> 
</div> 
<div style="border:1px yellow solid;float:left;" id="contentarea"> 
    <div style="border:1px solid;float:left;">filters and search</div> 
      <div style="border:1px solid;clear:left;"> 
      <div style="border:1px solid blue;float:left;width:200px;margin-right:20px;">tile 1</div> 
      <div style="border:1px solid blue;float:left;width:200px;margin-right:20px;">tile 2</div> 
      <div style="border:1px solid blue;float:left;width:200px;margin-right:20px;">tile 3</div> 

     </div> 
</div>

источник

2013-11-08 user2967774

Можете ли вы создайте скрипку? –

вот скрипка. если вы измените размер панели результатов, вы увидите их справа от боковой панели, а затем сделайте ее узкой, а под ней появятся плитки, а не укладываются под себя справа от боковой панели. http://jsfiddle.net/phatair/pRthu/ – user2967774

попробовать с помощью CSS, например размер экрана: @ медиа только экран и (мин-ширина: 1550px) {} @ СМИ только экран и (макс-ширина: 1449px) {}

источник

2013-12-12 19:52:03

float left wrapping parent вместо вложенных divs

ответ

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