Deixar tabela responsiva em site wordpress

Essa abordagem realmente funciona bem de forma universal, especialmente para evitar que tabelas quebrem no mobile. O uso de border-collapse: separate; e overflow-x: auto; garante que as células fiquem bem organizadas e o scroll horizontal seja ativado quando necessário. /* Tabela responsiva */ @media (max-width: 768px) { table { border-collapse: separate; border-spacing: 0; border-width: 1px 0 0 1px; display: block; overflow-x: auto; white-space: nowrap; width: 100% !important; } }

Mar 9, 2025 - 15:03

Deixar tabela responsiva em site wordpress

Essa abordagem realmente funciona bem de forma universal, especialmente para evitar que tabelas quebrem no mobile. O uso de border-collapse: separate; e overflow-x: auto; garante que as células fiquem bem organizadas e o scroll horizontal seja ativado quando necessário.

/* Tabela responsiva */
@media (max-width: 768px) {
table {
border-collapse: separate;
border-spacing: 0;
border-width: 1px 0 0 1px;
display: block;
overflow-x: auto;
white-space: nowrap;
width: 100% !important;
}
}