2015-09-26 182 views
0

我試圖設置表格的行和高度作爲使用各種類的百分比,但它們似乎不起作用。出於某種原因,百分比沒有被檢測到,我不知道爲什麼。表格百分比高度和寬度不工作的CSS類

我試過將表格高度和寬度設置爲100%,但是這會導致表格太寬而失去高度,所以它們都設置爲650px。

table{ 
height: 100%; 
width: 100%; 
height: 650px; 
width: 650px; 
border-style:hidden; 
/* centre the table */ 
margin: 0 auto; 
} 

我也嘗試設置身體的寬度和高度爲100%,根據其他人的建議,但這沒有效果。

body { 
height: 100%; 
width: 100%; 
} 

小提琴是: http://jsfiddle.net/g9apxqgb/5/

謝謝!

回答

0

當你寫height: 100%; width: 100%;時,你一定要想想100%是什麼?如果將table的父元素的<section>元素設置爲高度(例如400px),那麼您將看到table元素佔用該高度的100%

同樣的,如果你想table填滿整個屏幕,那麼你應該通過設置htmlbody元件獲得height100%width開始。

參見本jsFiddle,所述htmlbodymainsection元件具有全部height和`100%width

html, body, main, section { 
    height: 100%; 
    width: 100%; 
} 
+0

謝謝 - 我已經刪除了原始表格的高度和代碼,並將截面寬度和高度設置爲如下,但現在表格變平了 - 請參閱http://jsfiddle.net/g9apxqgb/9/ - 謝謝! –

+0

請看看我的jsFiddle,並嘗試找出它,我認爲這是你正在尋找的結果。這是一項家庭作業,我很抱歉,但這是我認爲你應該獲得的幫助。 – dayuloli