Untitled

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<style>
#a {
    width:153px;
    border-bottom:none;
    border-left:none;
    border-right:none;
    border-left:none;
    height:50px;
    float:left;
    text-align:center;
    border:1px solid red;
    margin:auto;
    padding:16px 0;
    box-sizing:border-box;
    color:blue;
}
#b {
    width:152px;
    height:50px;
    border-bottom:none;
    border-left:none;
    border-right:none;
    border-left:none;
    float:right;
    text-align:center;
    border:1px solid red;
    margin:auto;
    padding:16px 0;
    box-sizing:border-box;
    color:blue;
}
#c
{
    width:395px;
    height:50px;
    border-bottom:none;
    border-left:none;
    border-right:none;
    border-left:none;
    margin:auto;
    text-align:center;
    border:1px solid red;
    padding:16px 0;
    box-sizing:border-box;
    color:blue;
}
body
{
    width:702px;
    height:600px;
    border:1px solid red;
    margin:auto;
    box-sizing:border-box;

    }
#tu
{

    text-align:center;
    border:1px solid red;
    border-bottom:none;
    border-left:none;
    border-right:none;
    border-left:none;
    margin:auto;
    width:140px;
    height:auto;
    float:left;
    padding:2px 0;
    box-sizing:border-box;
    color:blue;
    background-color:pink;
}
#tu:hover {
    background-color: yellow;
}

#dinhmenh {
    text-align: center;
    border-bottom:none;
    border-left:none;
    border-right:none;
    border-left:none;
    margin: auto;
    float: left;
    height: 450px;
    width: 100px;
    border: 1px solid #F00;
    padding:200px 0;
    box-sizing:border-box;
    color:blue;
}
#hoho
{
    text-align: center;
    margin: auto;
    float: left;
    height: 450px;
    width: 500px;
    border: 1px solid #F00;
    box-sizing:border-box;
}
#yolo
{
    text-align: center;
    margin: auto;
    float: left;
    height: 50px;
    width: 702px;
    padding:25px 0;
    box-sizing:border-box;
    color:blue;
}
</style>
</head>

<body>
    <header>
        <p id="a">Left logo </p>
        <p id="b">Right logo</p>
        <p id="c">Banner</p>
    </header>
    <nav>
      <p id="tu">Home</p>
      <p id="tu">News</p>
      <p id="tu">Product</p>
      <p id="tu">About</p>
      <p id="tu">Login</p>
      <p id="dinhmenh">Left aside</p>
      <p id="hoho"></p>
      <p id="dinhmenh">Right aside</p>
      <p id="yolo">Footer</p>
    </nav>
    <a href="../Home.html"></a>
</body>
</html>