Se me descuadra la página en firefox

Tengo unas cuantas dudas y no sé como solucionarlas.

1. No sé q debo a hacer para q aparezca correctamente la web en firefox.

2. He añadido un margin-bottom al menu lateral y consigo alinear todo el texto de cada página. El incoveniente con el q me encuentro ahora es q se me descuadra el pie de página.

3. Otra cosa q me ocurre con el pie de pagina es q el pie del index aparece con el formato q yo quiero y en el resto de paginas aparece distinto. Por más q le doy vueltas al asunto no encuentro el error.

Os agradecería una ayudita...

Os dejo la url: http://andoni.mywebcommunity.org

El HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>Ingeniería Arana</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">


</head>





<body>
<div style="text-align: center;">

<div id="global">


<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo">




<script languaje="JavaScript">
var mydate=new Date()
var year=mydate.getYear()
if (year < 1000)
year+=1900
var day=mydate.getDay()
var month=mydate.getMonth()
var daym=mydate.getDate()
if (daym<10)
daym="0"+daym
var dayarray=new Array
("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado")
var montharray=new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto",
"Septiembre","Octubre","Noviembre","Diciembre")
document.write("<font color='#000080' face='geneva'>"+dayarray+" "+daym+" de "+montharray
+" de "+year+"</font>")
</script>



<a href="empresa/index.html">


[contenido no disponible]
</a>
</div>
<div id="publicidad">

[contenido no disponible]








</div>
</div>

<div id="navegacion">

<ul>
  • Empresa
  • Areas de actividad
  • Proyectos
  • Contacto
  • Localización
  • Enlaces
  • Normativa
    </div>


    <div id="contenido">






    <div id="menu">
    <h1>Empresa</h1>
    <ul>
  • ¿Quienes somos?
  • Nuestros técnicos
  • Localización
  • Contacto


    </div>



    <div id="principal">

    <div class="portada">[contenido no disponible]
    <span>

    <h3>EDIFICACIONES</h3></p>

    Cálculo de estructuras de hormigón y metálicas </p>

    Proyectos de Naves industriales y de viviendas</p></span></div>
    <div class="portada">[contenido no disponible]
    <span>

    <h3>LICENCIAS DE APERTURA</h3></p>

    Actividades AMINP: hostelería, industria, ...</p>

    Actividades exentas: Comercios, Despachos, ...</p></span></div>
    <div class="portada">[contenido no disponible]
    <span>

    <h3>INSTALACIONES</h3></p>

    Proyectos de Protección contra Incendios, Elecricidad en Baja Tensión, Gas, Ascensores, Gruas Torre, Saneamiento y Fontanería</p></span></div>
    <div class="portada">[contenido no disponible]
    <span>

    <h3>GESTION INTEGRADA</h3></p>

    Asesoramiento y gestión integrada del cliente: Ejecucion del proyecto técnico, tramitación de la documentación para la apertura de un negocio, ...</p></span></div>

    </div>


    <div id="pie">

    <div id="pie1">


    Ingeniería Arana - Atención al cliente - Avda. Guipuzcoa Nº 26 Bajo - Irun // Telf: 943666050 / Tlf. móvil: 600.42.40.34 / Fax: 943.61.80.75 </p>


    Ingeniería Arana - Centro de Estudio y cálculo - Sr. Aranzate Nº4 Bajo - Irun - Teléfono: 943.63.49.52 - Fax: 943.63.49.53</p>
    </div>

    <div id="pie2">
    <a href="mailto:[correo eliminado] ; [correo eliminado]; [correo eliminado]">

    [contenido no disponible]</a></p></a>

    </div>


    </div>




    <div id="curva-inferior"></div>
    </div>

    </div>
    </body>
    </html>


    El CCS:

    * {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
    p {text-align: justify}

    h1 {font-size: 1.2em; color: rgb(153,204,0); font-weight: bold ; text-decoration: underline ;
    text-align: center}
    h2 {font.size: 1.1em; color: rgb(153,204,0) ; font-weight: bold ; text-decoration: underline ;
    text-align: justify}
    body {text-align: left }


    .portada {
    float:left;
    width:275px;
    height:275px;
    margin: 5px;
    padding:5px;
    background-color:rgb(153,204,0);
    border-right: #a5a7aa solid 1px;
    border-bottom: #a5a7aa solid 1px;
    text-align:center;
    color: white ;
    margin-top: 20px
    }

    .tecnicos {

    width:300px;
    height:100px;
    margin: 5px;
    margin-left: 150px;
    padding:5px;
    background-color:rgb(153,204,0);
    border-right: #a5a7aa solid 1px;
    border-bottom: #a5a7aa solid 1px;
    text-align:center ;
    color: white ;
    margin-top: 20px
    }

    .contenedorfoto {
    float:left;
    width:110px;
    height:110px;
    margin: 5px;
    padding:5px;
    background-color:rgb(153,204,0);
    border-right: #a5a7aa solid 1px;
    border-bottom: #a5a7aa solid 1px;
    text-align:center;
    color: white
    }


    .sedes {
    float:left;
    width:250px;
    height:300px;
    margin: 20px;
    margin-left: 90px;
    padding:5px;
    background-color:rgb(153,204,0);
    border-right: #a5a7aa solid 1px;
    border-bottom: #a5a7aa solid 1px;
    text-align:center;
    color: white
    }




    #global {width:800px ; margin:4px auto; }

    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width: 800px ;
    height:12px ;
    overflow: hidden }
    #cabecera {background-color: white ; border-left: black 1px solid ;
    border-right: black 1px solid ; height:120px}
    #logotipo {width:280px ; float:left }
    #publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 16px }
    #navegacion {background-color: gray ; border: black 1px solid ; height:20px}
    #navegacion li {float:left ; list-style:none ; margin: 0px 15px 0px 15px}
    #navegacion ul { margin-left: 60px }
    #contenido {background-color: white ; border-left: black 1px solid ;
    border-right: black 1px solid }
    #contenido p {margin: 10px 10px 0px 10px ; text-indent: 15px}

    #contenido li {list-style:none ; margin: 4px 8px 4px 6px;}


    #menu {color: black ; width: 150px ; float:left ;
    text-align:left ; margin: 3px 10px 3px 3px ;
    background-image: url(objetos/menu-parte-inferior1.gif);
    background-position: bottom ;
    padding-bottom:5px; margin-bottom: 500px }



    #menu li {list-style:none ; margin: 4px 8px 4px 6px }
    #menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
    background-image: url(objetos/menu-parte-superior.gif) }


    #pie {border-left: black 1px solid ; border-right: black 1px solid ;
    border-top: black 1px solid ; height: 50px ; margin-top: 20px }

    #pie1 {float:left ; width:710px ; color: white ; background-color: gray; font size: 11px ; height: 50px}

    #pie2 {float:left ; width:78px ; background-color: rgb(153,204,0); height: 50px }


    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width: 800px ;
    height:12px ;
    overflow: hidden }

    a {color: white ; text-decoration:none ; display: block }
    a:link {}
    a:visited {}
    a:hover {color: white ; text-decoration:underline ; background-color: silver}
    a:active {}



    #logotipo a {}
    #logotipo a:link {}
    #logotipo a:visited {}
    #logotipo a:hover {background-color: white }
    #logotipo a:active {}
  • Hola panzupo

    Gracias por tomarte la molestia de poner los códigos.

    Recuerda que debes escribir un nuevo tema por cada duda, si te parece bien dejamos este para los problemas de visualización en firefox.

    En cuanto a esos problemillas yo te recomiendo que hagas la web de 0 fijándote en cómo se ve en firefox y luego el internet explorer ya lo arreglarás. En tu caso hiciste al revés.

    Luego te recomiendo usar algunas técnicas para que se vea mejor tu web en la amyoría de los navegdores (busca en google info al respecto):

    - Reset css
    - Hojas de estilos exclusivas para internet explorer
    - Hacks css

    Saludos ;)
    Gracias Foley. Sois de gran ayuda! es un marrón q me han mandado en el curro y se me está haciendo bastante durillo.
    He investigado sobre el reset.css pero se me escapa un poco... He colocado una reset.css nueva pero no la entiendo muy bien.
    Llevo toda la tarde dandole vueltas y no entiendo por qué en firefox en index aparece un franja horizontal verde justo debajo del menú horizontal. Tampoco sé como arreglar el desajuste del pie de página al haber agregado un margen-bottom al menu lateral.

    Agradecería una ayuda

    URL: http://andoni.mywebcommunity.org
    Tienes el firefox instalado verdad? Es que parece que hablas un poco desanimado, desde que pusiste el reset.css tu web en firefox se ve muchísimo mejor, solo te faltan 3 o 4 cosas por arreglar.

    Siguiendo con lo del reset, acabo de mirar y lo tienes bien instalado, no tienes que tocarle más.

    Dame un ratillo, voy a mirarte la web haber si consigo arreglarte algo más. Estate por el foro atento ;)
    Mira, te tuve que hacer unos cambios:

    :arrow: Sacar los espacios en el html y css.
    :arrow: Estructurar mejor el código.
    :arrow: Una nueva hoja de estilos para los navegador ie >=5 (mayor o igual que 5, es decir, ie 6; 7 y 8). Apartir de ahora tiene la estilo-general.css para firefox y todos los anvegadores que no sean ie y estilos-ie.css para los ie.
    :arrow: Te arreglé lo del espacio ese verde de una forma un poco "fea" diría yo. Usé un margin: -20px, es la primera vez que lo uso pero si no encuentras una forma mejor pues no veo el problema de dejarlo así :P
    :arrow: Le puse el tamaño de letra correcto al pie1 y pie2
    :arrow: Le di más anchura al pie2

    Luego tienes algunos errores por ahí de bordes y tal pero eso ya lo sabes hacer tu me imagino.
    Recuerda también arreglar la curva-inferior.gif ya que se ve el color blanco en las esquinas redondeadas.

    Sin más te dejo los archivos pero ojo, recuerda hacer una copia de seguridad de los archivos que tienes ahora mismo subidos al servidor web.

    Index.html:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
    <title>Ingeniería Arana</title>
    <link rel="stylesheet" href="reset.css" type="text/css" />
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    <link rel="shortcut icon" href="favicon.ico" >
    	<!--[if gte IE 5]>
    		<link rel="stylesheet" type="text/css" href="estilos-ie.css" />
    	<![endif]-->
    </head>
    <body>
    <div style="text-align: center;"> 
    <div id="global">
    	
    <div id="curva-superior"></div>
    <div id="cabecera">
      <div id="logotipo">	
    		
    			 <script languaje="JavaScript"> 
    					var mydate=new Date() 
    					var year=mydate.getYear() 
    					if (year < 1000) 
    					year+=1900 
    					var day=mydate.getDay() 
    					var month=mydate.getMonth() 
    					var daym=mydate.getDate() 
    					if (daym<10) 
    					daym="0"+daym 
    					var dayarray=new Array 
    					("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado") 
    					var montharray=new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto", 
    					"Septiembre","Octubre","Noviembre","Diciembre") 
    					document.write("[size="1"]<font color='black'face='geneva'>"+dayarray[day]+" "+daym+" de "+montharray[month] 
    					+" de "+year+"</font>[/size]") 
    					</script>
    	    			[url="empresa/index.html"][img]objetos/logo.png[/img][/url]	
      </div>
    	<div id="publicidad">
    	[img]objetos/txingudi.jpg[/img]
    	</div>				 
    </div>
    <div id="navegacion">
    <ul>
    [*][url="index.html"][b]Empresa[/b][/url]
    [*][url="areas-actividad/areas-actividad.html"][b]Areas de actividad[/b][/url]
    [*][url="proyectos/proyectos.html"][b]Proyectos[/b][/url]
    [*][url="contacto/contacto.html"][b]Contacto[/b][/url]
    [*][url="localizacion/localizacion.html"][b]Localización[/b][/url]
    [*][url="enlaces/enlaces.html"][b]Enlaces[/b][/url]
    [*][url="normativa/normativa.html"][b]Normativa[/b][/url]
    [/list]
    </div>
    
    	  <div id="contenido">		
    
    		 <div id="menu">
        <h1>Empresa</h1>
    		<ul>
    			[*][url="empresa/quienes-somos.html"]¿Quienes somos?[/url]
    			[*][url="empresa/nuestros-tecnicos.html"]Nuestros técnicos[/url]
    			[*][url="empresa/localizacion.html"]Localización[/url]
    			[*][url="empresa/contacto.html"]Contacto[/url]
    		[/list]
    		</div>
      
      <div id="principal">  
    		<div class="portada">[url="areas-actividad/edificaciones.html"][img]objetos/argmodificado.jpg[/img][/url]
    <span>
    
    <h3>[b]EDIFICACIONES[/b]</h3></p>
    
    Cálculo de estructuras de hormigón y metálicas </p>
    
    Proyectos de Naves industriales y de viviendas</p></span></div> 
    		<div class="portada">[url="areas-actividad/licencias-y-autorizaciones.html"][img]objetos/licencias-apertura.jpg[/img][/url]
    <span>
    
    <h3>[b]LICENCIAS DE APERTURA[/b]</h3></p>
    
    Actividades AMINP: hostelería, industria, ...</p>
    
    Actividades exentas: Comercios, Despachos, ...</p></span></div> 
    		<div class="portada">[url="areas-actividad/instalaciones.html"][img]objetos/instalaciones.jpg[/img][/url]
    <span>
    
    <h3>[b]INSTALACIONES[/b]</h3></p>
    
    Proyectos de Protección contra Incendios, Elecricidad en Baja Tensión, Gas, Ascensores, Gruas Torre, Unidades de suministro de gasóleo</p></span></div> 
    		<div class="portada">[url="areas-actividad/gestion-integrada.html"][img]objetos/gestion-integrada.jpg[/img][/url]
    <span>
    
    <h3>[b]GESTION INTEGRADA[/b]</h3></p>
    
    Asesoramiento y gestión integrada del cliente: Ejecucion del proyecto técnico, tramitación de la documentación para la apertura de un negocio, ...</p></span></div> 
      </div>
      
     <div id="pie">
     			<div id="pie1">
    				
    
    Ingeniería Arana - Atención al cliente - Avda. Guipuzcoa Nº 26 Bajo - Irun // Telf: 943666050 / Tlf. móvil: 600.42.40.34 / Fax: 943.61.80.75 </p>
    				
    
    Ingeniería Arana - Centro de Estudio y cálculo - Sr. Aranzate Nº4 Bajo - Irun - Teléfono: 943.63.49.52 - Fax: 943.63.49.53</p>
    			</div>
     			<div id="pie2">
    				<a href="mailto:[correo eliminado] ; [email][correo eliminado][/email]; [email][correo eliminado][/email]">
    
    [img]objetos/buzon.gif[/img]</a></p></a>
     			</div>	
     </div>
    
    	  <div id="curva-inferior"></div>
    </div>
    
    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    
    </script>
    <script type="text/javascript">
    try {
    var pageTracker = _gat._getTracker("UA-12797319-1");
    pageTracker._trackPageview();
    } catch(err) {}</script>
    </body>
    </html>

    estilo-general.css:

    * {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
    p {text-align: justify}
    h1 {font-size: 1.2em; color: rgb(153,204,0); font-weight: bold ; text-decoration: underline ;
        text-align: center}
    h2 {font.size: 1.1em; color: rgb(153,204,0) ; font-weight: bold ; text-decoration: underline ; 
        text-align: justify}
    body {text-align: left ; background-color: rgb(153,204,0)   }
    .portada { 
       float:left; 
       width:275px; 
       height:250px; 
       margin: 5px;
    	 padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center;
    	 color: white ;
    	 margin-top: 20px
    } 
    .tecnicos { 
     
       width:300px; 
       height:100px; 
       margin: 5px; 
    	 margin-left: 150px; 
       padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center ;
    	 color: white ;
    	 margin-top: 20px
    } 
    .contenedorfoto { 
       float:left; 
       width:110px; 
       height:110px; 
       margin: 5px; 
       padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center;
    	 color: white 
    } 
    .sedes { 
       float:left; 
       width:250px; 
       height:300px; 
       margin: 15px; 
    	 margin-left: 85px; 
       padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center;
    	 color: white 	 
    } 
    #global     {width:800px ; margin:4px auto; }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; 
                      background-repeat: no-repeat ;
                      width: 800px ;
                      height:12px ;
                      overflow: hidden }								
    #cabecera   {background-color: white ; border-left: black 1px solid ; 
                border-right: black 1px solid ; height:150px}
    #logotipo   {width:280px ; float:left }
    #publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 12px  }
    #navegacion {background-color: gray ; border: black 1px solid  ; height:25px ;  padding:5px}
    #navegacion li {float:left ; list-style:none ; margin: 0px 15px 0px 15px ; font-size: 16px }
    #navegacion ul { list-style:none; margin-left: 60px }
    #contenido  {background-color: white; border-left: black 1px solid ; border-right: black 1px solid; margin-top: -20px}
    #contenido p {margin:10px 10px 0px 10px ; text-indent: 15px}
    #contenido li    {list-style:none ; margin: 4px 8px 4px 6px;}
    #menu       {color: white ; width: 150px ; float:left ; 
                 text-align:left ; margin: 3px 5px 500px 3px ;
                 background-image: url(objetos/menu-parte-inferior1.gif);
    			 			 background-position: bottom ;
                 padding-bottom:5px  }					 
    #menu ul,li    {list-style:none ; margin: 4px 8px 4px 6px }
    #menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;background-image: url(objetos/menu-parte-superior.gif) }							
    #pie  {border-left:  black 1px solid ; border-right: black 1px solid ; border-top:   black 1px solid ; height: 50px ; margin-top: 20px;}				
    #pie1  {float:left ; width:710px ; color: white ; background-color: gray; height: 50px}
    #pie1 p {font-size:10px}
    #pie2 {float:left ; width:86px ; background-color: rgb(153,204,0); height: 50px; border: 0px}
    #pie2 p {font-size:10px}
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ; 
                      background-repeat: no-repeat ;
                      width: 800px ;
                      height:12px ;
                      overflow: hidden ;	}									
    a {color: white ; text-decoration:none ; display: block } 
    a:link {} 
    a:visited {} 
    a:hover {color: white ; text-decoration:underline ; background-color: silver} 
    a:active {} 

    estilos-ie.css:
    * {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
    p {text-align: justify}
    h1 {font-size: 1.2em; color: rgb(153,204,0); font-weight: bold ; text-decoration: underline ;
        text-align: center}
    h2 {font.size: 1.1em; color: rgb(153,204,0) ; font-weight: bold ; text-decoration: underline ; 
        text-align: justify}
    body {text-align: left ; background-color: rgb(153,204,0)   }
    .portada { 
       float:left; 
       width:275px; 
       height:250px; 
       margin: 5px;
    	 padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center;
    	 color: white ;
    	 margin-top: 20px
    } 
    .tecnicos { 
     
       width:300px; 
       height:100px; 
       margin: 5px; 
    	 margin-left: 150px; 
       padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center ;
    	 color: white ;
    	 margin-top: 20px
    } 
    .contenedorfoto { 
       float:left; 
       width:110px; 
       height:110px; 
       margin: 5px; 
       padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center;
    	 color: white 
    } 
    .sedes { 
       float:left; 
       width:250px; 
       height:300px; 
       margin: 15px; 
    	 margin-left: 85px; 
       padding:5px; 
       background-color:rgb(153,204,0); 
       border-right: #a5a7aa solid 1px; 
       border-bottom: #a5a7aa solid 1px; 
       text-align:center;
    	 color: white 	 
    } 
    #global     {width:800px ; margin:4px auto; }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; 
                      background-repeat: no-repeat ;
                      width: 800px ;
                      height:12px ;
                      overflow: hidden }								
    #cabecera   {background-color: white ; border-left: black 1px solid ; 
                border-right: black 1px solid ; height:150px}
    #logotipo   {width:280px ; float:left }
    #publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 12px  }
    #navegacion {background-color: gray ; border: black 1px solid  ; height:25px ;  padding:5px}
    #navegacion li {float:left ; list-style:none ; margin: 0px 15px 0px 15px ; font-size: 16px }
    #navegacion ul { list-style:none; margin-left: 60px }
    #contenido  {background-color: white ; border-left: black 1px solid ; 
                 border-right: black 1px solid ; margin: 0px}
    #contenido p {margin: 10px 10px 0px 10px ; text-indent: 15px}
    #contenido li    {list-style:none ; margin: 4px 8px 4px 6px;}
    #menu       {color: white ; width: 150px ; float:left ; 
                 text-align:left ; margin: 3px 5px 500px 3px ;
                 background-image: url(objetos/menu-parte-inferior1.gif);
    			 			 background-position: bottom ;
                 padding-bottom:5px  }					 
    #menu ul,li    {list-style:none ; margin: 4px 8px 4px 6px }
    #menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;background-image: url(objetos/menu-parte-superior.gif) }							
    #pie  {border-left:  black 1px solid ; border-right: black 1px solid ; border-top:   black 1px solid ; height: 50px ; margin-top: 20px;}				
    #pie1  {float:left ; width:710px ; color: white ; background-color: gray; height: 50px}
    #pie1 p {font-size:10px}
    #pie2 {float:left ; width:86px ; background-color: rgb(153,204,0); height: 50px; border: 0px}
    #pie2 p {font-size:10px}
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ; 
                      background-repeat: no-repeat ;
                      width: 800px ;
                      height:12px ;
                      overflow: hidden ;
    									}			
    a {color: white ; text-decoration:none ; display: block } 
    a:link {} 
    a:visited {} 
    a:hover {color: white ; text-decoration:underline ; background-color: silver} 
    a:active {} 

    Un saludo, son 50 euros :wink:




    Es broma, jajaja
    Muchísimas gracias Foley!! En serio, no sabes cuanto te lo agradezco.
    La verdad es q empiezo a ver la luz al final del tunel y veo q esto va cogiendo forma.

    He quitado el "margin-top: -20px" porque me arreglaba el menu navegación del index pero me estropeaba el del resto de páginas.
    El resultado de esta operación es q el index se ha desmoronado por completo.
    Existe alguna otra fórmula para conseguirlo? No encuentro el error...

    Os dejo la URL: http://andoni.mywebcommunity.org

    Gracias a todos! y sobre todo a ti, Foley!
    Yo solo te arreglé la index, el resto de páginas tendrías que haberlas arreglado tu mismo siguiendo el patrón de la index que yo te pasé.

    Si le sacas ese margin-top: -20px, que ya te dije que queda extraño pero acabo de comprobar de que hay gente que lo usa y les va bien.

    No entiendo cómo se te ha descuadrado tanto tanto la página al sacarle ese margin-top. En teoría debería aparecer otra vez esa franja verde entre el menu horizontal y el div del contenido.

    Saludos
    Soy un tenazas!!!
    He seguido tu patron pero no sé q le ha podido ocurrir a la index
    Le he vuelto a meter margin-top: -20px y se ve igual de mal.
    Sin el margin top las demás paginas se ven correctas pero la index está de pena. Esto es una locura!
    un saludo
    Vale, ya lo tengo:

    - En la index tuviste que hacer algún cambio más a parte de lo del margin para que se te vea así de mal porque, como puedes ver si le pones el margin se ve mal igual.
    - Si observas las otras secciones de tu web ahora que tienen el margin-top puesto, puedes ver que el menú sale cortado por culpa de ese margin, por lo tanto, el margin no hace falta ponerlo solo que, en tu index tienes algo que hace que se cree esa franja verde entre el menú y el contenido.

    Yo te puedo dar una solución cutrilla y rápida, por si tienes algo de prisa y no te quieres comer el coco demasiado:

    :arrow: Crea un nuevo div en la hoja de estilos de firefox (estilo-general.css) que se llame contenido 2 de la siguiente forma:

    #contenido2 {background-color: white; border-left: black 1px solid ; border-right: black 1px solid; margin-top: -20px}

    (fíjate lo que puse en negrita).

    :arrow: Ahora modifica el div contenido sacándole lo del margin-top
    :arrow: No sé si me sigues, ahora mismo tenemos en la hoja de estilos de firefox dos divs iguales, uno con el margin-top y otro sin él.
    :arrow: En la index.html cuando pones
    <div id="contenido">
    pon
    <div id="contenido2">

    Supongo que pensarás, menuda solución más cutre, pues bien, es totalmente viable hacer eso si tienes prisa y te estás empezando a desquiciar con el temita. Luego, cuando descubras qué es lo que tiene la index para que se cree esa franja verde cuando no le pones el margin-top pues ya puedes volver a usar el div contenido (sin margin-top) en tu index.html :)

    Un saludo, ahora no hay excusa para que se vea bien ;)
    Hola de nuevo Foley!
    La verdad es q este proyecto de la web me urge bastante porque en la empresa me están presionando con los plazos.
    No sé q había tocado. He vuelto a empezar de cero y he aplicado el truco de contenido y contenido 2 y se ve bastante bien.

    Lo único raro q le veo es q la letra y el estilo del pie de página es distinta respecto al resto de hojas de la web. A saber por q será?? Tú sabes? Esto de la programación es un misterio.

    Te agradezco mucho la ayuda y si algún día necesitas algo de Ingenieria (construcción y esas cosas... nada de informatica) aqui estamos para devolverte el favor.

    Seguiré con el contenido y más adelante ya te preguntaré sobre hosting, dominios, posicionamiento y demás... GRACIAS
    jeje bueno pues tomo nota entonces :)

    Para arreglar eso que dices tienes que poner en estilos-general.css lo siguiente:

    #contenido2 p {margin:10px 10px 0px 10px ; text-indent: 15px} 
    #contenido2 li    {list-style:none ; margin: 4px 8px 4px 6px;} 

    Con eso conservarías los estilos de p y li del div contenido en el nuevo contenido2 que creamos.

    Ya ves, no es ningún misterio, al principio cuesta pero fuchicando mucho ves los cambios y cómo funciona todo.

    Si me quieres hacer alguna pregunta sobre hosting, dominios y tal, escribe un nuevo tema en la sección correspondiente.

    Saludos
    Buenos dias tengo un problema, espero puedan ayudarme he hecho una web con un encabezado en Flash y cuando lo veo en IE se ve perfecto, pero cuando lo veo en Firefox, sale una raya gris espantosa, aqui les paso el link: www.sbh.com.pe.

    A que se debe este problema,? Graciassss
    el codigo es el siguiente:

    <html><head>
    <title>:: SUPER BOTICAS HOLLYWOOD ::</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link href="../../web/estilos2.css" rel="stylesheet" type="text/css">
    <script type="text/JavaScript">
    <!--
    function MM_preloadImages() { //v3.0
    var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a.indexOf("#")!=0){ d.MM_p=new Image; d.MM_p[j++].src=a;}}
    }

    function MM_swapImgRestore() { //v3.0
    var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
    }

    function MM_findObj(n, d) { //v4.01
    var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
    if(!(x=d)&&d.all) x=d.all; for (i=0;!x&&i<d.forms.length;i++) x=d.forms;
    for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
    if(!x && d.getElementById) x=d.getElementById(n); return x;
    }

    function MM_swapImage() { //v3.0
    var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
    if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    </script>
    <style type="text/css">
    <!--
    body {
    background-image: url(images/fondo5.jpg);
    }
    .Estilo1 {
    font-size: 10px;
    color: #B3F3FF;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    }
    -->

    .Estilo2 {
    font-size: 10px;
    color: #ffffff;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    }
    -->
    </style></head>
    <body leftmargin=0 topmargin=0 marginwidth=0 marginheight=0 onLoad="MM_preloadImages('menu/images/menu_on_02.jpg','menu/images/menu_on_03.jpg','menu/images/menu_on_04.jpg','menu/images/menu_on_05.jpg','menu/images/menu_on_06.jpg','menu/images/menu_on_07.jpg','menu/images/menu_on_08.jpg','images/index_08_on.jpg','images/index_18_on.jpg','images/index_20_on.jpg','images/index_06_on.jpg')">
    <table width="20%" height="771" border="0" align="center" cellpadding="0" cellspacing="0" bordercolor="#AAAAAA" bgcolor="#FFFFFF">
    <tr>
    <td height="769"><table id="Tabla_01" width=996 height=766 border=0 cellpadding=0 cellspacing=0>
    <tr>
    <td height="127" colspan=9 background="images/2.jpg"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab…" width="995" height="127" hspace="0" vspace="0">
    <param name="movie" value="swf/enc.swf">
    <param name="quality" value="high">
    <param name="SCALE" value="noborder">
    <embed src="swf/enc.swf" width="995" height="127" hspace="0" vspace="0" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" scale="noborder"></embed>
    </object> </td>
    <td> <img src="images/espacio.gif" width=1 height=127 alt=""></td>
    </tr>
    <tr>
    <td height="207" colspan=2 background="images/index_02.jpg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><a href="index.html" target="_top"><img src="menu/images/menu_on_01.jpg" width="245" height="29" border="0"></a></td>
    </tr>
    <tr>
    <td><a href="nosotros.html" target="_self" onMouseOver="MM_swapImage('Image49','','menu/images/menu_on_02.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="menu/images/menu_off_02.jpg" name="Image49" width="245" height="25" border="0"></a></td>
    </tr>
    <tr>
    <td><a href="locales.html" target="_self" onMouseOver="MM_swapImage('Image51','','menu/images/menu_on_03.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="menu/images/menu_off_03.jpg" name="Image51" width="245" height="24" border="0"></a></td>
    </tr>
    <tr>
    <td><a href="servicios.html" target="_self" onMouseOver="MM_swapImage('Image52','','menu/images/menu_on_04.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="menu/images/menu_off_04.jpg" name="Image52" width="245" height="26" border="0"></a></td>
    </tr>
    <tr>
    <td><a href="promociones.html" target="_self" onMouseOver="MM_swapImage('Image53','','menu/images/menu_on_05.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="menu/images/menu_off_05.jpg" name="Image53" width="245" height="25" border="0"></a></td>
    </tr>
    <tr>
    <td><a href="tips_consejos.html" target="_self" onMouseOver="MM_swapImage('Image54','','menu/images/menu_on_06.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="menu/images/menu_off_06.jpg" name="Image54" width="245" height="26" border="0"></a></td>
    </tr>
    <tr>
    <td><a href="hollynotas.html" target="_self" onMouseOver="MM_swapImage('Image55','','menu/images/menu_on_07.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="menu/images/menu_off_07.jpg" name="Image55" width="245" height="24" border="0"></a></td>
    </tr>
    <tr>
    <td><a href="contactenos.html" target="_self" onMouseOver="MM_swapImage('Image56','','menu/images/menu_on_08.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="menu/images/menu_off_08.jpg" name="Image56" width="245" height="29" border="0"></a></td>
    </tr>
    </table> </td>
    <td colspan=6 rowspan=2> <img src="images/index_03.jpg" width=532 height=216 alt=""></td>
    <td rowspan=2> <img src="images/index_04.jpg" width=217 height=216 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=207 alt=""></td>
    </tr>
    <tr>
    <td colspan=2> <img src="images/index_05.jpg" width=246 height=9 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=9 alt=""></td>
    </tr>
    <tr>
    <td colspan=2> <a href="revista.html" target="_self" onMouseOver="MM_swapImage('Image61','','images/index_06_on.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="images/index_06.jpg" name="Image61" width="246" height="135" border="0"></a></td>
    <td rowspan=8> <img src="images/index_07.jpg" width=14 height=275 alt=""></td>
    <td rowspan=3> <a href="servicios.html" target="_self" onMouseOver="MM_swapImage('Image57','','images/index_08_on.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="images/index_08.jpg" name="Image57" width="234" height="139" border="0"></a></td>
    <td colspan=2 rowspan=5> <img src="images/index_09.jpg" width=32 height=147 alt=""></td>
    <td rowspan=2> <a href="nosotros.html" target="_self" onMouseOver="MM_swapImage('Image58','','images/index_10_on.jpg',0)" onMouseOut="MM_swapImgRestore()"><img src="images/index_10.jpg" name="Image58" width="237" height="138" border="0"></a></td>
    <td rowspan=8> <img src="images/index_11.jpg" width=15 height=275 alt=""></td>
    <td rowspan=6 bgcolor="#CCCCCC"> <img src="images/index_12.jpg" width=217 height=194 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=135 alt=""></td>
    </tr>
    <tr>
    <td rowspan=7> <img src="images/index_13.jpg" width=1 height=140 alt=""></td>
    <td rowspan=3> <img src="images/index_14.jpg" width=245 height=8 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=3 alt=""></td>
    </tr>
    <tr>
    <td rowspan=3 bgcolor="#FFFFFF"> <img src="images/index_15.gif" width=237 height=9 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=1 alt=""></td>
    </tr>
    <tr>
    <td rowspan=2> <img src="images/index_16.jpg" width=234 height=8 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=4 alt=""></td>
    </tr>
    <tr>
    <td width="245" height="132" rowspan=4 background="images/index_17.jpg" bgcolor="#CCCCCC">
    <div align="center">
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab…" width="224" height="125" hspace="0" vspace="0">
    <param name="movie" value="swf/locales.swf">
    <param name="quality" value="high">
    <param name="SCALE" value="noborder">
    <embed src="swf/locales.swf" width="224" height="125" hspace="0" vspace="0" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" scale="noborder"></embed>
    </object>
    </div></td>
    <td> <img src="images/espacio.gif" width=1 height=4 alt=""></td>
    </tr>
    <tr>
    <td colspan=2 rowspan=3 bgcolor="#FFFFFF"><a href="hollynotas.html" target="_self" onMouseOver="MM_swapImage('Image59','','images/index_18_on.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="images/index_18.gif" name="Image59" width="236" height="128" border="0"></a>
    </td>
    <td rowspan=3> <img src="images/index_19.jpg" width=30 height=128 alt=""></td>
    <td rowspan=3> <a href="tips_consejos.html" target="_self" onMouseOver="MM_swapImage('Image60','','images/index_20_on.jpg',1)" onMouseOut="MM_swapImgRestore()"><img src="images/index_20.jpg" name="Image60" width="237" height="128" border="0"></a></td>
    <td> <img src="images/espacio.gif" width=1 height=47 alt=""></td>
    </tr>
    <tr>
    <td> <img src="images/index_21.jpg" width=217 height=8 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=8 alt=""></td>
    </tr>
    <tr>
    <td width="217" height="96" rowspan=2 background="images/index_22.jpg" bgcolor="#CCCCCC">
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab…" width="216" height="89">
    <param name="movie" value="swf/bolsa.swf">
    <param name="quality" value="high">
    <embed src="swf/bolsa.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="216" height="89"></embed></object>
    </td>
    <td> <img src="images/espacio.gif" width=1 height=73 alt=""></td>
    </tr>
    <tr>
    <td colspan=8 rowspan=3> <img src="images/index_23.jpg" width=778 height=109 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=23 alt=""></td>
    </tr>
    <tr>
    <td> <img src="images/index_24.jpg" width=217 height=9 alt=""></td>
    <td> <img src="images/espacio.gif" width=1 height=9 alt=""></td>
    </tr>
    <tr>
    <td width="217" height="81" rowspan=2 background="images/index_25.jpg"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab…" width="216" height="77">
    <param name="movie" value="swf/contactanos.swf">
    <param name="quality" value="high">
    <embed src="swf/contactanos.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="216" height="77"></embed></object>
    </td>
    <td> <img src="images/espacio.gif" width=1 height=77 alt=""></td>
    </tr>
    <tr>
    <td height="38" colspan=8 rowspan=2 background="images/index_26.jpg"><div align="right" class="Estilo2">
    <table width="77%" border="0" cellspacing="0" cellpadding="0" class="Estilo2">
    <tr>
    <td height="18" valign="top"> <div align="left">Copyright &copy;
    2010 :: SUPER BOTICAS HOLLYWOOD :: Todos los Derechos Reservados</div></td>
    </tr>
    </table>
    </div></td>
    <td> <img src="images/espacio.gif" width=1 height=4 alt=""></td>
    </tr>
    <tr>
    <td width="217" height="34" valign="middle" background="images/index_27.jpg"><div align="center" class="Estilo2">Realizado
    por: <a href="http://www.facebook.com/GiselaYamazato" target="_blank" class="Estilo1">Gisela
    Yamazato</a> </div></td>
    <td> <img src="images/espacio.gif" width=1 height=34 alt=""></td>
    </tr>
    <tr>
    <td> <img src="images/espacio.gif" width=1 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=245 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=14 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=234 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=2 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=30 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=237 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=15 height=1 alt=""></td>
    <td> <img src="images/espacio.gif" width=217 height=1 alt=""></td>
    <td></td>
    </tr>
    </table></td>
    </tr>
    </table>
    </body>
    </html>