Tema: Crear un menu centrado con div y CSS
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 13/04/2010, 04:42
tempto
 
Fecha de Ingreso: julio-2009
Mensajes: 103
Antigüedad: 15 años, 7 meses
Puntos: 2
Respuesta: Crear un menu centrado con div y CSS
Aquí lo tienes, me he permitido la licencia de hacerte algunos cambios en el css.
Un consejo, utiliza las identaciones y los intros para aclarar más el código y diferenciar unas partes de otras

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
  5. <title>Documento sin t&iacute;tulo</title>
  6. <style type="text/css">
  7. <!--
  8. body{
  9. font-family : Helvetica, Verdana, Arial, sans-serif;
  10. background-color : white;
  11. }
  12. a:link {
  13. font-size : 14px;
  14. font-style : normal;
  15. font-weight : normal;
  16. color : #fffaf3;
  17. text-decoration : none;
  18. border : 0;
  19. }
  20.  
  21. .central {
  22. top: 5px;
  23. margin:auto;
  24. text-align:center;
  25. height:80px;
  26. width:400px;
  27. }
  28. .fondo{
  29. position:absolute;
  30. top:0px;
  31. height:100px;
  32. width:100%;
  33. background-image: url('http://www.factoriadearte.com/imagenes/fondo_arriba.gif');
  34. }
  35.  
  36. #botonera{
  37. text-align:center;
  38. margin:auto;
  39. }
  40.  
  41. #botonera li {
  42.     display:inline;
  43. }
  44.  
  45. -->
  46. </style>
  47. </head>
  48.  
  49. <body>
  50. <div class="fondo">
  51. <div class="central";><a href="http://www.factoriadearte.com/" target="_self"> <img src="http://www.factoriadearte.com/imagenes/logo_arriba.png" width="139" height="51" alt="dise&ntilde;o gr&aacute;fico" border="0"/></a>
  52.  
  53.     <div id="botonera">
  54.         <ul>
  55.             <li> <a href="http://www.factoriadearte.com/" target="_self">Inicio</a> </li>
  56.             <li> <a href="http://www.factoriadearte.com/nosotros.php" target="_self">Nosotros</a> </li>
  57.             <li> <a href="http://www.factoriadearte.com/diseno.php" target="_self" >Dise&ntilde;o</a> </li>
  58.             <li> <a href="http://www.factoriadearte.com/contacto.php" target="_self">Contacto</a> </li>
  59.         </ul>
  60.     </div>
  61. </div>
  62. </div>
  63.  
  64. </body>
  65. </html>

Salu2