Bordes tablas movil

#1 (**permalink**) 23/08/2017, 20:15

Hola a todos, una consulta cuando navego a traves de un movil en mi web veo unos bordes finos en la tabla, y tengo totalmente eliminados los bordes, en table:

<table border="0" cellspacing="0">

Ademas en el css hago esto:

table{
border-color:transparent;
background-color:transparent;
border-width:0px;
border-style:hidden;
}

td{
border-color:transparent;
background-color:transparent;
border-width:0px;
border-style:hidden;
}

Y aun se ven, que puedo hacer? hay algun truco?

Salduos, espero puedan ayudarme. gracias

petit89 · #2 (**permalink**) 23/08/2017, 20:42

trata asi:

Código CSS:

Ver original#tutabla_id{
    border: none !important;
}

#3 (**permalink**) 23/08/2017, 20:50

No pasa nada, pense que era mi cel, ocupe el ipad de mi hermano y sigue igual.

No se que pasa

#4 (**permalink**) 23/08/2017, 21:01

Disculpa se me olvido agregar que estoy dando un intercalado de colores, hago esto:

Código CSS:

Ver original#tabla tr:nth-child(2n){
background-color:#2E2EFE;
}
 
#tabla tr:nth-child(2n+1){
background-color:#2E64FE;
}

Entonces con esos colores los bordes contrastan y se ven, son finisimos pero se notan.

Edito, dejo lo que veo, y su código:

Código HTML:

Ver original<html>
<head>
<style>
#tabla{
border:none !important;
border-color:transparent;
background-color:transparent;
border-width:0px;
margin:100px;
border-collapse: collapse;
}
 
#tabla td{
border:none !important;
border-color:transparent;
border-width:0px;
font-size:20px;
font-family:arial;
padding:2px 10px;
color:#fff;
background-color:transparent;
}
 
#tabla tr:nth-child(2n){
border:hidden !important;
background-color:#2E2EFE;
}
 
#tabla tr:nth-child(2n+1){
border:hidden !important;
background-color:#2E64FE;
}
 
</style>
</head>
<body>
<table id="tabla" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td>1.1</td>
        <td>1.2</td>
        <td>1.3</td>
        <td>1.4</td>
    </tr>
        <tr>
        <td>2.1</td>
        <td>2.2</td>
        <td>2.3</td>
        <td>2.4</td>
    </tr>
        <tr>
        <td>3.1</td>
        <td>3.2</td>
        <td>3.3</td>
        <td>3.4</td>
    </tr>
</table>
</body>
</html>

Incluso heredé el bg color, border color haciendo esto:

Código CSS:

Ver original#tabla tr:nth-child(2n){
border:hidden !important;
background-color:#2E2EFE;
border-color:#2E2EFE;
}
 
#tabla tr:nth-child(2n+1){
border:hidden !important;
background-color:#2E64FE;
border-color:#2E64FE;
}
 
#tabla td{
background-color:inherit;
border-color:inherit;
}

Y nada...

ArturoGallegos · #5 (**permalink**) 24/08/2017, 20:00

Con el código expuesto no se aprecia ningún borde, por lo que asumo que tienes algún otro CSS que esta afectando,

revisa bien, algo se te esta escapando

petit89 · #6 (**permalink**) 24/08/2017, 21:40

Cita:

Iniciado por ArturoGallegos

Con el código expuesto no se aprecia ningún borde, por lo que asumo que tienes algún otro CSS que esta afectando, revisa bien, algo se te esta escapando

Con el codigo expuesto si se genera el error, cuando lo ves en el telefono. El error es en los moviles, no en la PC...

He estado haciendo pruebas y me he fijado que si eliminas el intercalado, claro que funciona sin bordes... luego de varias pruebas... no lo he conseguido

https://jsfiddle.net/oregmx7g/
https://jsfiddle.net/oregmx7g/1/
https://jsfiddle.net/oregmx7g/2/

Rafael · #7 (**permalink**) 25/08/2017, 03:14

Se me hace que simplemente es algo del sistema operativo.

Mi solución era ponerle fonro a la fila, pero eso también ya lo has hecho.

#8 (**permalink**) 25/08/2017, 05:03

Cita:

Iniciado por ArturoGallegos

Con el código expuesto no se aprecia ningún borde, por lo que asumo que tienes algún otro CSS que esta afectando,

revisa bien, algo se te esta escapando

Sigo teniendo el problema

Cita:

Iniciado por petit89

Con el codigo expuesto si se genera el error, cuando lo ves en el telefono. El error es en los moviles, no en la PC...

He estado haciendo pruebas y me he fijado que si eliminas el intercalado, claro que funciona sin bordes... luego de varias pruebas... no lo he conseguido

https://jsfiddle.net/oregmx7g/
https://jsfiddle.net/oregmx7g/1/
https://jsfiddle.net/oregmx7g/2/

Si no se que sera y es raro porque pense que puede ser un tema de la resolucion de pantalla cuando haces un zoom max. Los bordes desaparecen

#9 (**permalink**) 25/08/2017, 05:36

Estaba leyendo un poco en inet y parece que table tiene problemas de resolucion. Y que lo mejor es emular una tabla con divs. Con dos propiedadea de display. Table-cell y row. Lo voy a probar durante el dia y veo que tal me fue