部門沒有填充高度

努力幫助學生完成他的項目，試圖讓他的部門填滿整個頁面。部門沒有填充高度

我試過以下HTML和BODY標籤設置爲100％的各種示例，但是當我爲我的Div設置最小高度時，它不會填充頁面的整個高度。這是我的代碼。當它呈現綠色應填充頁面，但它不。

感謝KT

<html> 
<center> 
<head> 

    <link href="styles.css" rel="stylesheet" type="text/css"/> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
</head> 
<body> 

    <div class="tblwrap" height="100%">  
    <table class="scndtable" > 
      <tr class="headerrow"> 
       <td height=100%><a href="summary.html">Summary</a> </td> 
       <td><a href="map.html">Map</a> </td> 
       <td><a href="videos.html">Videos</a> </td> 
      </tr> 
     </table> 
    </div> 
    <p style="font-weight: bold;text-align: center;"> </p> 

</body> 
</center>

這裏是我的CSS

html 
{ 
height:100%; 
} 
body 
{ 
margin:0; 
padding:0; 


vertical-align: middle; 
height: 100%; 
border: 20px solid skyblue; 
} 
body table 
{ 
margin-left:auto; 
margin-right:auto; 
height:100%; 

} 
.tblwrap 
{ 
background-color:green; 
min-height: 100%; 

    vertical-align: middle; 
border:solid 3px red; 
} 
.headerrow{ 
text-align: center; 

} 
.scndtable 
{ 
border-spacing:20px; 
height: 100%; 

} 
.headerrow td{ 
font-size: 20pt; 


background-color:silver; 

} 
.headerrow td a{ 
text-decoration: none; 
color: black; 
} 
.headerrow td a:hover{ 
text-decoration: none; 
color: gray; 
} 
.selectednav 
{ 
font-size: 72px; 
font-weight: bold; 
color:navy; 
}

來源

2012-05-11 Kevrone

.tblwrap{position:absolute; 
    top:0px; 
    left:0px; 
    right:0px; 
    bottom:0px; 
    background-color:green; 
    vertical-align: middle; 
    border:solid 3px red; 
    oveflow:auto; 
    }

這會爲你工作:-)

來源

2012-05-11 06:30:35

這將永遠不會延伸超過頁面的整個高度雖然 – Hubro

div滾動條將表現得像身體滾動條沒有區別 – 2012-05-11 06:34:53

假設整個網頁將在div內 – Hubro

它總是有幫助的重新您的問題在JSFiddle之前你問你在StackOverflow上的問題。我試圖重新您的具體問題，但對我來說股利容易拉伸視口的高度：

http://jsfiddle.net/hWGVr/

但與ANKIT高塔姆的解決方案，這將始終覆蓋視口的高度，從未拉伸進一步

來源

2012-05-11 06:34:23 Hubro

部門沒有填充高度

回答

相關問題