Tengo este código de HTML y este de CSS:
.burua{ padding: 0px; margin: 0px; width: 100%; background-color:#000000; height:65px; } #p1{ font-size: 350%; text-align: center; } a:link{ text-decoration:none; color: #000000; } a:visited{ color: #000000; text-decoration:none; } #nombreEndi{ text-align: center; margin:0 auto; position: relative; top: 50%; color: #8B0000; font-family: "TituloEndi"; font-size:40px; } .header{ height:100px; width:100%; text-align:center; } .menu{ height: 40px; width:100%; margin-top: 0px; text-align:center; background-color: #191919; background-image: -moz-linear-gradient(top, #191919, #000000); background-image: -o-linear-gradient(top, #191919, #000000); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #191919), color-stop(1, #000000)); background-image: -webkit-linear-gradient(#191919, #000000); background-image: linear-gradient(top, #191919, #000000); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#191919', endColorStr='#000000'); border-top: 1px solid rgba(50, 50, 50, 0.3); } .wrapper{ height:2000px; width:100%; padding-top:20px } .menu-fixed { position:fixed; z-index:1000; top:0; width:100%; box-shadow: 2px 2px 5px #999; } ul{ list-style-type: none; margin: 0; padding: 0; overflow: hidden; display: inline-block; font-size: 25px; width: 100%; } body{ margin: 0; background-image: url("../ARGAZKIAK/background.png"); background-attachment: fixed; } #menu li{ display: inline-block; list-style: none; } .listaArriba{ color: #000000; width: 150px; } #titulua{ background-color:#000; text-align:center; margin-left: 300px; margin-top: 7px; } #signUp{ height:250px; position:fixed; width: 200px; margin-left: 250px; margin-top: 100px; text-align: center; color: white; } #logIn{ height:250px; position:fixed; width: 200px; margin-left: 575px; margin-top: 70px; text-align: center; color: white; } #help{ height:250px; position:fixed; width: 200px; margin-left: 900px; margin-top: 100px; text-align: center; color: white; } .argazkia{ margin-left:10px; } #azalpena{ font-size: 35px; } #behealdea{ margin-top:0px; height: 30px; background-color: #191919; background-image: -moz-linear-gradient(top, #191919, #000000); background-image: -o-linear-gradient(top, #191919, #000000); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #191919), color-stop(1, #000000)); background-image: -webkit-linear-gradient(#191919, #000000); background-image: linear-gradient(top, #191919, #000000); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#191919', endColorStr='#000000'); border-top: 1px solid rgba(50, 50, 50, 0.3); width: 100%; position: fixed; bottom: 0; text-align: center; }
<header class="burua"> <div class = "cabecera"> <p id="p1">DiruBank</p> </div> </header> <div class="menu" id="menu"> <nav class="top-menu"> <ul class = "navigation"> <li class="listaArriba" id="news"><a href="#">NEWS</a></li> <li class="listaArriba" id="conciertos"><a href="#">GIGS</a></li> <li class="listaArriba" id="videos"><a href="#">VIDEOS</a></li> <li class="listaArriba" id="songs"><a href="#">MUSIC</a> </li> <li class="listaArriba" id="lyrics"><a href="#">LYRICS</a></li> <li class="listaArriba" id="store"><a href="#">STORE</a></li> </ul> </nav> </div> <div id="signUp"> <img class="argazkia" id="arg1" src="../ARGAZKIAK/signUp.png"/> <p id="azalpena">Sign up</p> </div> <div id="logIn"> <img class="argazkia" id="arg2" src="../ARGAZKIAK/login.png"/> <p id="azalpena">Log In</p> </div> <div id="help"> <img class="argazkia" id="arg3" src="../ARGAZKIAK/help.png"/> <p id="azalpena">Help</p> </div> <footer id="behealdea"> <a href="#"> Egileak </a> </footer>
Y la web se ve así:
Lo que no entiendo es que genera el cacho gris de la parte de arriba.
Saludos.