将许多不同的div元素放在右边，每个元素的高度和宽度都是100％（全屏）

即时消息面临一个问题，我需要一些建议。我想有几个主要的div容器可以说将许多不同的div元素放在右边，每个元素的高度和宽度都是100％（全屏）

<div class="main">

彼此的权利。

所有主容器应该有全宽和全高（全屏）。
在右边，我需要一些其他主容器的大小和宽度的前者。

是否可以将div设置为相互正确，而无需使用javascript读取和设置？有没有一个CSS/HTML解决方案？

enter image description here

例子：

<div class="main"><!--to the right one more --> 
</div> 

<div class="main"><!--to the right one more --> 
</div> 

<div class="main"> 
</div>

风格：＃这不工作...

.main{ 
width:100%; 
height:auto; 
float: right; 

}

来源

2012-02-17 Jurudocs

能否请您重新提供您的示例代码 - 我想你ま在输入时出现错误，在你的问题中没有显示 – wheresrhys 2012-02-17 12:41:00

use style = display：inline for your div – 2012-02-17 12:41:06

@wheresrhys我编辑了例子...感谢您的帮助 – Jurudocs 2012-02-17 12:48:20

我可能误解了这个问题，但尝试

html, body { 
    height: 100%; 
} 

body { 
    width: 300%; 
} 

.main { 
    height: 100%; 
    width: 33.333333333%; 
    float: left;  
}

http://jsfiddle.net/3yaJZ/

来源

2012-02-17 13:12:48 wheresrhys

嗨谢谢你的尝试和你的小提琴......我可能会明白我想要的东西是如何工作的...我设置了html，身体达到了300％并保持了.main CSS来自你...我想要那些主要div不在宽度33.33，但在100％... – Jurudocs 2012-02-17 13:17:08

哦，我看到...已经更新我的答案，相应地提供所需的效果 – wheresrhys 2012-02-17 14:32:47

希望我所了解的是你想告诉..从我的理解，你想3 div（主）将在一个位组件（容器），其中每个是100％的宽度，你可以检查每个DIV你水平滚动....

在你的CSS

body{ 
width:300%; 
height:100%; 
} 
.main{ 
width:100%; 
height:100%; 
float:left; 
}

，并将HTML -

<body> 
<div class="main"><!--to the right one more --> 
</div> 

<div class="main"><!--to the right one more --> 
</div> 

<div class="main"> 
</div> 
</body>

来源

2012-02-17 13:44:30

谢谢... .main {with：100％}不起作用，但33.33％做 – Jurudocs 2012-02-17 13:51:04

@jurudocs yup ..我的坏..'.main'的宽度相对于它的父母，即身体 - 因为它已经是300％ - 你应该把它设置为33.33％（300）因此 - 你会得到宽度是〜100％的身体.. – 2012-02-17 18:15:28

将许多不同的div元素放在右边，每个元素的高度和宽度都是100％（全屏）

回答

相关问题