將許多不同的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％（全屏）

回答

相關問題