allora eccoci, scusate ma il lavoro mi ha tenuto lontano dal mio progetto, allora ho rivisto il codice che ora dovrebbe essere corretto e completo, non riesco però a far capire alla grafica che deve occupare la pagina intera sia in larghezza che in altezza, infatti la grafica (se pur semplice) del menù in alto si estende per svariati scroll in larghezza

codice:
<!doctype html>
<html>
   <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Futura Logisca e Trasporti Tomao</title>
      <style>
         div
         }
         .header{
         background-color:#fff;
         width:100%;
         height:100px;
         display: flex;
         }
         .logo{
         height:100px;
         width:10%;
         position: Absolute;
         top: 10px;
         left: 3px;
         }	
         .menu{
         height:100px;
         position: absolute;
         top: 70px;
         left: 211px;
         width: 100%;
         }
         div.menu:before{
         content: '';
         top: 2px;
         left: 195px;
         position: absolute;
         border-top: 24px solid #fff;
         border-right: 14px solid transparent;
         width: 0;
         }
         .topbar{
         height:25px;
         min-width: 100%;
         position: Absolute;
         top: 45px;
         left: 650px;
         background-color: #1f6383;
         }
         div.topbar:before{
         content: '';
         top: 0px;
         left: 0px;
         position: absolute;
         border-top: 25px solid #fff;
         border-right: 14px solid transparent;
         width: 0;
         }	
         .bottombar{
         height:25px;
         width: 80%;
         position: Absolute;
         top: 98px;
         left: 552px;
         background-color: #7e9faa;
         }
         div.bottombar:before{
         content: '';
         top: 1px;
         left: 0px;
         position: absolute;
         border-bottom: 25px solid #fff;
         border-right: 20px solid transparent;
         width: 0;
         }	
         /* menu top*/
         ul {
         list-style-type: none;
         margin-top: 72px;
         margin-left: 192px;
         padding-left: 352px;
         overflow: hidden;
         background-color: #2e9bac;
         height: 25px;
         }
         li {
         float: left;
         }
         li a {
         display: block;
         color: white;
         text-align: left;
         padding: 3px 5px;
         text-decoration: none;
         }
         li a:hover {
         background-color: #1f6383;
         }
         li a:active {
         background-color: #7e9faa;
         }
         li {
         border-right: 1px solid #fff;
         border-left: 1px solid #fff;
         }
         li:last-child {
         border-right: 1px solid #fff;
         }	
         #lat_sx
         {
         position: relative;
         top: 20px;
         left: 10px;
         background-color: #fff;
         width: 180px;
         height: 300px;
         border: 1px solid #eee;
         }
         /* menu sx*/
         #lat_sx ul {
         list-style-type: none;
         margin: 0;
         padding: 0;
         width: 200px;
         background-color: #f1f1f1;
         border: 1px solid #555;
         }
         #lat_sx li a {
         display: block;
         color: #000;
         padding: 8px 16px;
         text-decoration: none;
         }
         #lat_sx li {
         text-align: center;
         border-bottom: 1px solid #555;
         }
         #lat_sx li:last-child {
         border-bottom: none;
         }
         #lat_sx li a.active {
         background-color: #2e9bac;
         color: white;
         }
         #lat_sx li a:hover:not(.active) {
         background-color: #1f6383;
         color: white;
         }
         .desktop{
         position: absolute;
         top: 162px;
         left: 400px;
         background-color:#eee;
         min-width: 100%;
         min-height: 100%;
         }
      </style>
   </head>
   <body>
	   <div class="header"></div>
      <div class="logo">
         <img src="immagini/loghi/Futura_logo-xsmall.jpg" width="403" height="100" alt=""/>
      </div>
   <div class="menu"></div>
      <ul>
         <div>
            <li><a href="#home">Contatti</a></li>
            <li><a href="#news">News</a></li>
            <li><a href="#contact">Noi</a></li>
            <li><a href="#about">Home</a></li>
         </div>
      </ul>
      <div class="topbar">
      </div>
      <div class="bottombar">
      </div>
      <div id="lat_sx">
         <ul>
         <li>
         <a class="active" href="#home">Home</a></li>
         <li><a href="#news">News</a></li>
         </ul>
      </div>
      <div class="desktop">
         <a href="#home">desktop</a>	 
      </div>
   </body>
</html>