2013-03-20 95 views
0

我很抱歉,如果這是一個微不足道的問題,但我似乎無法弄清楚。我有this website,我需要側面的導航欄,並且右側的矩形(具有「ContentExtender」類的那個)伸展到物理頁面的底部(而且,ContentExtender只需要儘可能地將內容融合在一起,但這是另一回事)。什麼是最簡單的方法來做到這一點?我查了一下,發現將身體的高度設置爲100%應該可以工作,但事實並非如此。我知道這是一個很大的代碼,翻閱,所以這裏是代碼的實際重要組成部分(任何與「CC」前綴是註釋出來的只是一個簡單的方法):你需要給DIV不會一直延伸到頁面的底部?

.ContentExtender { 
    background-image: url(bgblack.png); 
    min-height: 10px; 
    ccmin-width: 200px; 
    ccwidth:100%; 
    margin: 0px 0px 0px 1010px; 
    position: absolute; 
    top: 110px; 
    right: 0px; 
    left: 0px; 
} 
.MainParent { 
    position: absolute; 
    left:0px; 
    top:0px; 
    right:0px; 
    bottom: 0px; 
    background-color:rgba(70,70,70,.7); 
    min-height: 600px; 
    min-width: 1000px; 
    max-width: 1000px; 
    height: 100%; 
    margin: 0px 10px 0px 10px; 
    z-index:100; 
    overflow: hidden; 
} 
+1

你看着你的jsfiddle? – dezman 2013-03-20 01:14:21

+0

哈哈,它有什麼問題嗎? – Oztaco 2013-03-20 01:18:47

+0

你不能僅僅從jsFiddle引用bgblack.png。 – dezman 2013-03-20 01:21:59

回答

0

html,body {height:100%; }加上你想要的元素的任何其他父母height: 100%;height: 100%;

+0

我已經嘗試過,它只是將其設置爲可視區域的大小整個頁面的頁面 – Oztaco 2013-03-20 01:19:36

+0

那麼,那麼你的頁面沒有你的屏幕那麼高,但它仍然是100%。你可以在你的頁面中創建任何東西「height:9999px」,你會看到。 – dezman 2013-03-20 01:21:07

+0

頁面比屏幕高很多,但導航欄和ContentExtender只能在屏幕上延伸? – Oztaco 2013-03-20 01:24:33

0

我最近有一個問題,我不能延伸到窗口的頂部,這可能是相似的。我設置了:

body { 
    margin: 0px; 
} 

就你而言,它可能是另一個元素。我已經看到所有可能的元素被有意設置爲0的邊界,然後所需的邊界被重新實現。

+0

我已經有了我的身體設置,並將它們全部設置爲0px;似乎沒有工作 – Oztaco 2013-03-20 01:21:00

0

好像有一個在你的代碼的一個小錯誤嘗試修改

.ContentExtender 

,並更改爲

#ContentExtender 

然後你就可以修復它,如果這個方法行不通嘗試在內容擴展程序的HTML標記上設置後臺CSS,如下所示

html{ 
height:100%;  
background:#ccc url(bgblack.png); 

}

上面是一個例子,所以請湊合

+0

糟糕,我在編輯之前放錯了鏈接:/對不起 – Oztaco 2013-03-20 01:22:25

0

您的問題被鏈接到一個事實,即孩子DIV不能直接決定父母的行爲。

嘗試在你的父母DIV的其中之一:

overflow: auto; 

display: table; 

或者在孩子的div:

display: table-row; 

當你嘗試,實驗省略 「高度:布拉布拉」 屬性。

類似的問題就迎刃而解了:[1]:CSS - Expand float child DIV height to parent's height

+0

每當我這樣做時,它就會將所有內容都分開,就像在我的所有導航欄鏈接之間留下巨大的空白 – Oztaco 2013-03-21 22:31:55