Tema: Problema con divs ; HTML + CSS [AYUDA]
Ver Mensaje Individual
  #3 (permalink)  
Antiguo 25/06/2010, 02:06
Avatar de alberduris
alberduris
 
Fecha de Ingreso: junio-2010
Ubicación: Bizkaia
Mensajes: 7
Antigüedad: 13 años, 10 meses
Puntos: 0
Exclamación Respuesta: Problema con divs ; HTML + CSS
Bueno, mejor que EZakto no se puede responder pero el problema sigue ahí.

Como tu me has dicho he puesto los flotantes arriba (menu, menu1, menu2) y después el contenido y además en el CSS he puesto margin-top de 25 pixeles a los tres divs del menu para que se separen de la barra de navegación... pero al insertar otra vez el contenido (Las imagenes de siempre en este caso) me pasa esto...



La verdad estaba convencido de que la espuesta de Ezakto iba a ser la que me solucionaría todo pero no sé porque no lo ha sido xD

Bueno os dejo los códigos tal y como están ahora...

HTML:
Código HTML: 
Ver original
  1. <html>
  2. <head>
  3. <title>Page title</title>
  4. <link rel="stylesheet" href="estilotpc.css" type="text/css" media="all">
  5. </head>
  6.  
  7. <body>
  8.  
  9.  
  10. <div id="global">
  11. <a href="#"><img src="tpclogo.png" width="1000" height="108" alt="tpclogo (60K)" /></a>
  12. <div id="navegacion">
  13. <font size="3">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Menos de 10 € &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Entre 11 y 50 €  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Entre 51 y 100€</font> 
  14. </div><!--navegacion-->
  15.  
  16.  
  17.  
  18. <div id="menu1">
  19. <img src="botondecategorias.jpg" width="25" height="25" alt="botondecategorias (1K)" />
  20. </div>
  21. <div id="menu2">
  22. <font color="#585858"> &nbsp;Ofertas</font>
  23. </div>
  24. <div id="menu">
  25. <ul>
  26. <li><font color="#FF8000">></font> cosa
  27. <li><font color="#FF8000">></font> cosa
  28. <li><font color="#FF8000">></font> cosa
  29. <li><font color="#FF8000">></font> cosa
  30. <li><font color="#FF8000">></font> cosa
  31. <li><font color="#FF8000">></font> cosa
  32. <li><font color="#FF8000">></font> cosa
  33. <li><font color="#FF8000">></font> cosa
  34. </ul>
  35. </div>
  36.  
  37.  
  38. <div id="contenido">
  39. <img src="objetos/tallerpc.gif" width="318" height="111" alt="tallerpc (11K)" />
  40. <img src="objetos/tallerpc.gif" width="318" height="111" alt="tallerpc (11K)" />
  41. <img src="objetos/tallerpc.gif" width="318" height="111" alt="tallerpc (11K)" />
  42. <img src="objetos/tallerpc.gif" width="318" height="111" alt="tallerpc (11K)" />
  43. </div>
  44. </body>
  45. </html>

CSS:
Código CSS: 
Ver original
  1. * {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
  2. p {text-align: center}
  3. h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ;
  4.     text-align: center}
  5. h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; 
  6.     text-align: center}
  7. body        {text-align: center }
  8. #global     {width:1000px ; margin:4px auto }
  9.  
  10. #cabecera   {background-color: white ; border-left: black 1px solid ;
  11.              border-right: black 1px solid ; height:85px}
  12. #logotipo   {width:280px ; float:left }
  13. #publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 16px ; text-align:center}
  14. #navegacion {background-color: #A4A4A4 ; border: no-border  ; height:25px ; text-align: left ; color: #FFFFFF }
  15. #navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px }
  16. #navegacion ul { margin-left: 300px }
  17. #contenido  {background-color: #FFFFFF ; border-left: black 1px solid ; 
  18.              border-right: black 1px solid ; text-align: center }
  19. #contenido p {margin: 5px 10px 0px 10px ; text-indent: 15px}
  20.  
  21. #menu2      {background-color: #E6E6E6 ; width: 126px ; float:left ; height: 24px ;
  22.              text-align: left ; border-top: #D8D8D8 1px solid ; margin-top: 25px }
  23.  
  24.  
  25.  
  26. #menu1      {background-color: #E6E6E6 ; width: 25px ; float:left ; height: 25px ;
  27.              text-align: left ; margin-top: 25px }
  28.  
  29. #menu       {background-color: #FFFFFF ; width: 150px ; float:under #menu1 ; height:300px ;
  30.              text-align: left ; margin-top: 25px ; border-right: #D8D8D8 1px solid ; border-left: #D8D8D8 1px solid ; border-top: #D8D8D8 1px solid ; border-bottom: #D8D8D8 1px solid }
  31.  
  32.  
  33. #menu2 li    {list-style:none ;  }
  34.  
  35. #menu2 h1 {}
  36.  
  37.  
  38.  
  39. #menu1 li    {list-style:none ;  }
  40.  
  41. #menu1 h1 {}
  42.                          
  43.                          
  44.  
  45.  
  46. #menu li    {list-style:none ; margin: 4px 0px 4px 6px }
  47.  
  48. #menu h1 {}
  49. #pie     {border-left:  black 0px solid ; border-right: black 0px solid ; 
  50.           border-top:   black 0px solid ; height: 65px ; background-color : #FFFFFF ; width : 1300px ; border-bottom: black 0px solid }
  51.  
  52.  
  53.  
  54. a         {}
  55. a:link    {}
  56. a:visited {}
  57. a:hover   {}
  58. a:active  {}

Gracias a todos los que respondais, y para eZakto lo prometido es deuda, unos para ti.