Layout with BorderContainer

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css">
<div dojoType="dijit.layout.BorderContainer" design="headline" splitters="false" id="DashboardContainer">
    <div dojoType="dijit.layout.ContentPane" id="DashboardTop" region="top">
        
    </div>
    <div dojoType="dijit.layout.ContentPane" id="DashboardLeft" region="left">

    </div>
    <div dojoType="dijit.layout.ContentPane" region="center" id="DashboardCenter" >

    </div>
    <div dojoType="dijit.layout.ContentPane" region="bottom" id="DashboardBottom" >

    </div>
</div>

CSS

#DashboardContainer {
    width: 100%;
    height: 100%;
}
#DashboardTop {
    height: 100px;
}
#DashboardLeft {
    width: 300px;
}
#DashboardBottom {
    height: 100px;
}


html,body{ width: 100%; height: 100%; margin:0px;padding:0px; overflow: hidden;}

JavaScript

require(["dojo/parser", "dijit/layout/ContentPane", "dijit/layout/BorderContainer"]);