Comunidad de diseño web y desarrollo en internet online

¿Por que falla en IE?

Citar            
MensajeEscrito el 04 May 2011 10:10 am
Alguien puede decirme ¿por qué , SOLO, en Internet explorer esta estructura falla?
Hay dos columnas laterales que deberian ser de 27px pero solo le adjudica esta medida a la de la derecha, ampliando la de la izquierda y las dos colspan centrales toman lo que les cede el de la izquierda :twisted:
dejo enlace a una muestra simplificada de la pagina real:
[url=http://www.clubwala.com/prova.html][/url]

Gracias de antemano

Código HTML :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
<title>Club Wala Unipreus</title>
<meta name="title" content="Club Wala"/>
<link href="css/stylescopia.css" rel="stylesheet" type="text/css">
</head>
<body style="font-size:12px">
<table width="750" cellspacing="0" cellpadding="0" align="center" border="0">
<!-- COMENÇA EL MENU -->
<tr>
<td class="black"  height="90" colspan="3">&nbsp;<a href="/"><img src="imatges/logoClub.png" style="border:none; position:relative; left:15px" height="70"></a></td>
<td class="black" width="27">&nbsp;</td>
</tr>
 <tr>
   <td colspan="3" class="blau">
      <table align="right" style="font-size:14px" border="0" bordercolor="#FF0000">
         <tr>
            <td><a href="/">Inici</a></td>
            <td style="font-weight:bold">&nbsp;&nbsp;&middot;&nbsp;&nbsp;</td>
            <td><a href="benefits.html">Avantatges del Club</a></td>
            <td style="font-weight:bold">&nbsp;&nbsp;&middot;&nbsp;&nbsp;</td>
            <td><a href="register.php">Fer-me Soci</a></td>
            <td style="font-weight:bold">&nbsp;&nbsp;&middot;&nbsp;&nbsp;</td>
            <td><a href="shoplist.html">Les Nostres Botigues</a></td>
            <td style="font-weight:bold">&nbsp;&nbsp;&middot;&nbsp;&nbsp;</td>
            <td><a href="condicions.html">Condicions generals</a></td>
         </tr>
      </table>
   </td>
   <td width="27" class="blau">&nbsp;</td>
</tr>
<!--  ACABA EL MENU -->
<!-- INICIO DEL PROBLEMA las dos columnas de 27 deberian ser iguales adjudicando el resto a las 2 colspan centrales -->
   <tr>
      <td width="27" bgcolor="#66FFFF">&nbsp;</td>
      <td colspan="2" bgcolor="#99FF33"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis aliquet fermentum tortor. Praesent molestie tristique tortor. Nulla laoreet, orci eget fermentum varius, nunc diam imperdiet mauris, id ultrices ipsum purus sit amet dui. Sed eu pede in libero commodo faucibus. Suspendisse condimentum tortor id ante. Duis porta tellus at turpis. Nam pretium euismod arcu. Maecenas orci tellus, aliquet id, ornare eget, ultricies sed, libero. Nam porttitor luctus lorem. Nunc fermentum. In at risus. Nam odio urna, mattis quis, ultricies vitae, placerat sit amet, ipsum. Duis aliquam lobortis tellus. Cras consectetuer. Duis id eros. </p>
       <p>Maecenas aliquet arcu ut sapien. Aliquam erat volutpat. Praesent ante. Donec mattis mollis nunc. Fusce sit amet tellus ut mauris lacinia pretium. Integer vel ligula ac est convallis mollis. Fusce vulputate porttitor eros. Duis non pede. Aliquam pharetra nonummy dui. Phasellus ut risus in wisi pretium ullamcorper. Curabitur imperdiet commodo purus. </p></td>
      <td width="27" bgcolor="#66FFFF">&nbsp;</td>
   </tr>
</table>
</body>
</html>

Por loponti

51 de clabLevel



Genero:Masculino  

safari
Citar            
MensajeEscrito el 04 May 2011 01:12 pm
Con que diseñando con tablas ¿ah? :P

Divide el diseño en dos tablas distintas. Lo que tienes como encabezado y menú en una tabla, y otra tabla para el contenido a tres columnas.

El problema con IE es que calcula mal el ancho de la primer celda de la última fila respecto del colspan que tienes en la primer celda de la primer fila.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 04 May 2011 02:42 pm
Gracias voy a probar con dos tablas.

Por cierto lo de las tablas es para aprovechar parte que ya tenia y porque la barra de menú para que el texto en un <div> me quede centrado verticalmente le añadia un padding superior para desplazarlo un poco. Logicamente funciona bien en todos los navegadores exceopto co IE que calcula diferente el padding i me mueve el diseño.

Por loponti

51 de clabLevel



Genero:Masculino  

safari
Citar            
MensajeEscrito el 04 May 2011 03:27 pm
con dos tablas funciona. El problema és que en la pagina real que publico la tabla tiene un border 1 que al juntarse la dos tablas se multipica pero prefiero esto que lo que me mostraba antes

Por loponti

51 de clabLevel



Genero:Masculino  

safari
Citar            
MensajeEscrito el 04 May 2011 04:02 pm
Pues quítale los border a las tablas:

Código HTML :

<table style="border: 0; border-collapse: collapse;">

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 04 May 2011 05:25 pm
Lo he solucionado de otra manera. Como el borde lo tenia definido con un estilo he añadido dentro de la etiqueta en una tabla
<table style="border-bottom: none;>
y en la otra
<table style="border-top:none;>
ahora ya solo se ve el borde alrrededor de las dos tables como si solo fuera una.

Gracias

Por loponti

51 de clabLevel



Genero:Masculino  

safari

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.