1

在使用引导程序无法正确处理数小时后，尝试从头开始构建响应式布局。我的目标是在调整显示大小时让固定宽度的瓷砖相互包裹，但如果侧边栏右侧的 div 中仍有足够的宽度来显示它们，则不要包裹在侧边栏 div 下。

在下面的示例中，我希望这些图块相互包裹并在“过滤器和搜索”div 下方，而不是在最左侧的“内容”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>
4

1 回答 1

0

尝试使用 css 作为屏幕尺寸示例：@media only screen and (min-width: 1550px) {} @ media only screen and (max-width: 1449px) {}

于 2013-12-12T19:52:03.700 回答