*{box-sizing:border-box;} /* width: 50px; width: 20% relational sizing: X%; to parent container

...

*/ header{ height: 100px; padding: 20px; text-align: center; } nav ul{ list-style-type:none; background-color:yellow; text-align:center; } nav ul li { display:inline; } nav ul li a { color: blue; text-decoration:none; } nav ul li a:hover { background-color: red; } .row{margin:0px; } .row:after{ /*clearfix hack */ display:table; content:""; clear:both; } .left { float:left; width:60%; padding:5px 20px; background-color:gray; } .right { float:left; width:40%; padding:5px 20px; background-color:tan; } footer { padding: 20px; background-color:#A34037; }