文檔類型不工作，因爲它應該是

-2

我有DOCTYPE聲明的問題，似乎當我添加它，在我的頁面上，CSS犯規work.But當我刪除的文檔類型，一切正常fine.what可能是原因文檔類型不工作，因爲它應該是

HTML

<!DOCTYPE html> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="style.css"/> 
</head> 
<body> 
<div id="wrapper"> 
    <div id="header">this is my header 
    </div> 
    <div id="center_content"> 
     <div id="left"> 
     </div><div id="right"></div> 
    </div> 
    <div id="footer">this is my footer 
    </div> 
</div> 
</body> 
</html>

CSS

body 
{ 

margin:0px; 
padding:0px; 

} 
#wrapper 
{ 
height:100%; 
width:100% 
} 
#header 
{ 
width:100%; 
height:20%; 
background-color:red; 
} 
#center_content 
{ 
min-height:79%; 
height:auto; 
background-color:pink; 
overflow:auto; 

} 
#footer 
{ 
height:5%; 
background-color:blue; 
} 
#left 
{ 
float:left; 
min-height:79%; 
height:auto; 
width:20%; 
background-color:brown; 
} 
#right 
{ 
float:right; 
min-height:79%; 
height:auto; 
width:79%; 
background-color:yellow; 

}

來源

2014-04-02 Abhishek

Live link？檢查您的控制檯的錯誤，也因爲您使用的HTML5文檔，你不需要設置一個類型的CSS鏈接 –

我認爲你有一個不同的標準「應該」的定義。 – BoltClock

同樣使用十六進制/ rgb/rgba而不是紅色，粉紅色...... –

您的文檔類型不是問題。您只需瞭解使用％百分比時，還應該向父母/祖先聲明百分比寬度和高度，即<html>和<body>。

我修改了你的css。嘗試這個。

html, body { 
    margin:0px; 
    padding:0px; 
    width: 100%; 
    height: 100%; 
} 
#wrapper { 
    height:100%; 
    width:100%; 
} 
#header { 
    width:100%; 
    height:20%; 
    background-color:red; 
} 
#center_content { 
    height:79%; 
    background-color:pink; 
    overflow:auto; 
} 
#footer { 
    height:5%; 
    background-color:blue; 
} 
#left { 
    float:left; 
    height:100%; 
    width:20%; 
    background-color:brown; 
} 
#right { 
    float:right; 
    height:100%; 
    width:79%; 
    background-color:yellow; 
}

所以，當你刪除了doctype它Quirks Mode進入這就是爲什麼它呈現細微沒有DOCTYPE。

來源

2014-04-02 07:39:25 ralcazar

文檔類型不工作，因爲它應該是

回答

相關問題