This is a single page HTML/CSS layout. This is my first ever code and I know it's not perfect, but I would love for someone with a lot more experience to let me know of my mishaps.<!DOCTYPE HTML><html><head>    <link type=text/css rel=stylesheet href=dereke.css/>    <title>    </title></head><body>    <div class=Header>        <p>Ohio State Buckeyes</p>        <div id=logo>            <img src=http://vignette2.wikia.nocookie.net/logopedia/images/6/6f/1000px-Ohio_State_Buckeyes_logo_svg.png/revision/latest?cb=20130425230958 />        </div>        <div id=navbar>            <ul>                <li>Home</li>                <li id=noUD>|</li>                <li>About Us</li>                <li id=noUD>|</li>                <li>Contact Us</li>            </ul>        </div>    </div>    <div id=leftbody>            <img src=http://printableteamschedules.com/images/collegefootball/ohiostatebuckeyesfootballschedule.gif />        </div>        <div id=rightbody></div>    <div id=lowerbody>            <img src=http://grfx.cstv.com/schools/osu/graphics/facilities/stadium-night-800x325.jpg />        </div>    <div class=footer>         <p id=footword>Ohio State is the best college in the United States! 2016</p>    </div></body></html>CSS.Header {    width: calc(100%-16px);    height: 150px;    border-radius: 5px;}.Header p {    color: white;    margin-top: -5px;    width: 600px;    font-size: 70px;}.MidBody {    background-color: #141414;    width: 100%;    height: 850px;    margin-top: 10px;    border-radius: 5px;    position: relative;    display:block;}.footer {    bottom: 0;    height:50px;    width: 100%;    margin-top: 10px;    border-radius: 5px;    clear:both;    position:relative;    text-align:center;    color: white;}#leftbody {    width: 49%;    height: 425px;    left: 0;    margin-top: 3px;    margin-left: 3px;    position: relative;    z-index: 1;    border-radius: 5px;    float:left;}#leftbody img {    width: 490px;    height: 420px;    border-radius: 5px;    margin-top: 2px;    margin-left: 2px;}#rightbody {    background-color: #F1F1F1;    width: 49%;    height: 425px;    margin-top: 3px;    margin-right: 3px;    position: relative;    z-index: 1;    border-radius: 5px;    float:right;}#lowerbody {    width: 100%;    height:auto;    left:0;    right:0;    margin-left: auto;    margin-right: auto;    postion: relative;    display: inline-block;    text-align:center;}#lowerbody img {    position:relative;    border-radius: 5px;    margin-left: auto;    margin-right: auto;}body {    background-color: black;}li {    display: inline;    padding: 1px;    text-decoration: underline;}#navbar {    width: 350px;    color: #F8F8F2;    font-family: Arial Black;    margin: -35px;    text-align: left;    line-height: 10px;}#noUD {    text-decoration: none;}#logo img {    margin-top: -150px;    margin-right: 50px;    width: 15%;    height: 15%;    float: right;}
HTML single page layout
html;css