我的嵌套div如何与换行符一起出现问题。我试图寻找这个,但无济于事,因为这个问题很难说出来。
我有四个嵌套如下所示的div,都有显示内联块:
-------- ---------------------------
| menu | | content holder div |
| div | | ----------- ----------- |
| | | | content | | content | |
| | | | div 1 | | div 2 | |
| | | | | | | |
-------- | ----------- ----------- |
---------------------------
现在,菜单div和内容div具有灵活的宽度,取决于加载的数据。当任一内容div太宽时,我希望发生以下情况:
-------- ----------------------
| menu | | content holder div |
| div | | ----------- |
| | | | content | |
| | | | div 1 | |
| | | | | |
-------- | ----------- |
| ------------------ |
| | content div 2 | |
| | | |
| | | |
| ------------------ |
----------------------
但我得到以下内容:
--------
| menu |
| div |
| |
| |
| |
--------
---------------------------------
| content holder div |
| ----------- ----------------- |
| | content | | content div 2 | |
| | div 1 | | | |
| | | | | |
| ----------- ----------------- |
--------------------------------|
当菜单div足够高以隐藏任何内容被加载时,这是非常令人困惑的。此外,保持菜单div宽度固定只会被视为一个明确的最后手段。然而,div可以是浮点数而不是内联块,如果这会有所帮助。
有没有人知道如图所示保持布局的简单方法。 2?我已经测试过,如果另一个内容div不可见,那么当内容div适合如图2所示时,这仍然会发生。
编辑:
答案 0 :(得分:2)
为你的div“内容持有者div”轻松简单地添加max-width
,我可以给你数字,但你没有给jsfiddle。
答案 1 :(得分:1)
将它们切换为浮动将有助于保持您正在寻找的布局
http://jsfiddle.net/duncan/pXdDy/
给出内部内容div
min-width:48%;
margin:1%;
float:left;
将它们放在彼此旁边,直到内容变得足够宽以推动它们