Pregunta

No sé por qué esto me molesta tanto, pero cuando creo sitios web, siempre trato de hacer todo mi estilo con CSS. Sin embargo, una cosa que siempre tengo que recordar hacer cuando estoy trabajando con tablas es agregar cellpacing = " 0 " y cellpadding = " 0 "

¿Por qué no hay una propiedad CSS para anular estos atributos HTML 4 anticuados?

¿Fue útil?

Solución

Cellspacing :

table { border-collapse: collapse; }

En cuanto a cellpadding , puede hacer

table tr td, table tr th { padding: 0; }

Otros consejos

mat ya respondió, pero solo para completar:

  • padding & # 8594; cellpadding
  • espacio entre bordes & # 8594; cellspacing
  • border-collapse & # 8594; sin equivalente HTML

También vale la pena recordar que puede establecer valores horizontales y verticales separados para los CSS, p. espaciado de borde: 0 1px .

La restablecer hoja de estilo de Eric Myer contiene el siguiente estilo 'restablecer' para la tabla:

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

Además, TD, TR se restablecen:

thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

La razón por la que menciono esto es que tiene un comentario 'las tablas todavía necesitan cellpadding = 0'. Supongo que puso esto aquí por una razón, probablemente necesaria para algunos navegadores antiguos. A juzgar por el hecho de que este es uno de los pocos comentarios que incluyó, supongo que es importante y que hay una buena razón para ello.

Basado en este comentario, ¡y este comentario solo! - Sigo utilizando el espaciado de celdas = " 0 " en el marcado a menos que alguien me diga definitivamente (a continuación) por qué no necesito hacerlo. Sin embargo, podría ser innecesario en cualquier navegador moderno que valga la pena soportar en estos días.

table { border-collapse:collapse; }

Supongo que alguien consideró el espaciamiento celular como una & # 8220; mala práctica & # 8221 ;. Cómo entiendo que es equivalente incluido en el estándar CSS2, pero IE no admite esta propiedad. border-collapse permite establecer el espaciado en valor 0. El relleno de celda se puede lograr estableciendo la propiedad de relleno para los elementos TD de una tabla.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top