Test Foro de elhacker.net SMF 2.1

Programación => Desarrollo Web => Mensaje iniciado por: t4r0x en 10 Septiembre 2015, 04:16 AM

Título: Tabla de estilo collapse con extraño comportamiento
Publicado por: t4r0x en 10 Septiembre 2015, 04:16 AM
Bueno no sé si es extraño pero tengo una tabla con varias celdas y al veces las lineas de las filas no aparecen entre medio de ellas como esta imagen.
(http://s28.postimg.org/dlm3k63zh/Untitled.png)

porque pasa y como puedo solucionarlo? el codigo:
Código (html4strict) [Seleccionar]


<style>
   body
   {
       height: 100%;
       margin: 0px;
       padding: 0px;
   }

   table, th, td {
       border: 1px solid black;
       border-collapse: collapse;
   }
   
   .table-info
   {
       border-spacing: 0px;
   }
   
</style>

<body>
   <table class='table-info'>
       <tr>
           <th style='width:100px'>colum1</th>
           <th style='width:100px'>colum2</th>
           <th style='width:100px'>colum3</th>
           <th style='width:100px'>colum4</th>
           <th style='width:100px'>colum5</th>
           <th style='width:100px'>colum6</th>
       </tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
       <tr><td>Value1</td><td>Value2</td><td>Value3</td><td>Value4</td><td>Value5</td><td>Value6</td></tr>
   </table>
</body>
Título: Re: Tabla de estilo collapse con extraño comportamiento
Publicado por: ivancea96 en 10 Septiembre 2015, 22:21 PM
Si haces zoom a la web, sigue ocurriendo?
Título: Re: Tabla de estilo collapse con extraño comportamiento
Publicado por: #!drvy en 12 Septiembre 2015, 13:09 PM
Efectivamente, debe ser por zoom o fallo de rendering. El código lo tienes bien.

Saludos