Doc type打破我的CSS，爲什麼？

爲什麼添加文檔類型會打破此佈局？我怎樣才能讓這個更好？Doc type打破我的CSS，爲什麼？

的jsfiddle LINK：http://jsfiddle.net/3gA7u/1/

HTML

<body> 
    <div id="maincontainer"> 
     <div id="leftcolumn">left</div> 

     <div id="contentwrapper">right</div> 
    </div> 
</body>

CSS

body { 
margin: 0 auto; 
height: 100%; 
} 

#maincontainer { 
width:100%; 
height: 100%; 
} 

#leftcolumn { 
float:left; 
display:inline-block; 
width: 510px; 
height: 100%; 
background: orange; 
} 

#contentwrapper { 
position: fixed; 
float:left; 
display:inline-block; 
width: -moz-calc(100% - 510px); 
width: -webkit-calc(100% - 510px); 
width: calc(100% - 510px); 
height: 100%; 
background-color: red; 
}

的jsfiddle LINK：http://jsfiddle.net/3gA7u/1/

來源

2014-01-10 user2133606

添加一個'DOCTYPE'可能會*修正你的佈局（因爲它與你當前的CSS一樣），並且你認爲它的狀態沒有一個是「工作」的，實際上它可能被認爲是壞的。 – ajp15243