Designing a Page Layout CSS3 HTML5

/* New Perspectives on HTML5 and CSS3, 7th Edition Tutorial 3 Review Assignment Style Sheet for the Pandaisia Chocolates Monthly Specials Author: Ramisha Abbas Date: January 8th, 2018 Filename: pc_specials.css */ /* Page Body Styles */ body { margin-left: auto; margin-right: auto; width: 95%; min-width: 640px; max-width: 960px; } /* Image Styles */ body > header > img { display: block; width: 100%; } /* Horizontal Navigation Styles */ nav.horizontal li{ display:block; float:left; width:16.66%; nav.horizontalNavigation a { display: block; /* Row Styles */ div.newRow { clear:both; width: 100% } div.newRow::after { clear:both; content: ""; } /* Column Styles */ div[class^="col-"] { float:left; padding: 2%; box-sizing: border-box; } div.col-1-3.specials {width: 33.33%;} /* Specials Styles */ div { outline: 1px dotted rgb(71,52,29); min-height: 400px; } /* Award Styles */ awardList { overflow: auto; position: relative; height: 650 px; } div.awards { position: absolute; width: 30%; } awards#award1 { block; top:80px; left:5%; } awards#award2 { block; top:280px; left:60%; } awards#award3 { block; top:400px; left:20%; } awards#award4 { block; top:630px; left:45%; } awards#award5 { block; top:750px; left:5%; } /* Footer Styles */ footer::after { clear: both; content: ""; display: table; }