Editar formato das tabelas sem alterar o CSS

Resolvido magfalcaojr
(@magfalcaojr)

11 anos, 9 meses atrás

Olá pessoal, gostaria de tirar uma dúvida com vocês. Meu site possui um estilo pré-configurado para postagens (fontes, cores e tabelas). No entanto, em alguns posts eu preciso inserir tabelas que ultrapassam as margens da página.

O que eu preciso saber, é se existe alguma forma de editar o formato/dimensão de apenas algumas tabelas específicas sem precisar alterar nada no css. Pois atualmente, quando eu altero a tabela no wordpress, ela aparece do tamanho que eu quero no editor, mas quando publico o post, ela volta para o formato da folha de estilos e ultrapassa as margens.

Desde já, obrigado!

Visualizando 8 respostas - 1 até 8 (de um total de 8)

Moderador Míriam de Paula
(@miriamdepaula)

11 anos, 9 meses atrás
Talvez na aba HTML do editor, você consiga colocar o width que vc quer na tabela …
```
<table width="300">
...
</table>
```
Mas é muito mais bacana já ter definido no CSS o tamanho como 100%, assim se auto-ajusta ….

table { width:100% }

Abs.
Miriam de Paula
Criador do tópico magfalcaojr
(@magfalcaojr)

11 anos, 9 meses atrás

Obrigado Miriam. Se essa é a solução, creio que há algo errado no meu tema. No CSS a tabela já está configurada para 100%, mesmo assim, quando insiro uma grande, ela ultrapassa as margens. Veja:

.comment-content table {
border-bottom: 1px solid #ddd;
margin: 0 0 1.625em;
width: 100%;

Outro coisa, quando eu modifico pelo html do editor, através do
<table width=”300″> não ocorre mudança alguma.

Moderador Míriam de Paula
(@miriamdepaula)

11 anos, 9 meses atrás

Está online para que eu possa ver com o Chrome Inspector?

Criador do tópico magfalcaojr
(@magfalcaojr)

11 anos, 9 meses atrás

Nesse link está um post com uma tabela de exemplo:
http://portaldoservidor.jaboatao.pe.gov.br/teste-tabela/

E aqui está uma imagem ilustrando o problema:
http://imageshack.us/photo/my-images/502/tabelawp.jpg/

Obrigado.

Moderador Míriam de Paula
(@miriamdepaula)

11 anos, 9 meses atrás

Faz um teste:

Tenta usar 80% de width

width: 80%;

Se não der certo, então, verifica qual é o tamanho da área util do seu post e define o tamanho fixo, por exemplo: 600px

width: 600px;

Abs.
Miriam de Paula.

Moderador Míriam de Paula
(@miriamdepaula)

11 anos, 9 meses atrás

Continuei na busca de uma solução pra você e achei o link abaixo:
http://www.maujor.com/tutorial/tabelas-quebrando-layout.php

Parece que vai funcionar!

Tenta!

Abs.
Miriam de Paula

Criador do tópico magfalcaojr
(@magfalcaojr)

11 anos, 9 meses atrás

Miriam, muito obrigado pela ajuda! Através das suas dicas, aparentemente, resolvi o problema. Não cheguei a seguir as instruções do link, mas fiz as seguintes alterações no CSS e funcionou:

Estilo antigo:

.entry-content table{border: 1px solid #E7E7E7;margin: 0px 0px 24px 0px;text-align: left;width: 100%!important;}
.entry-content table td{padding: 5px 10px!important; border:1px solid #e9e9e9;}
.entry-content p img{margin:0px 0px 0px 0px!important;}

Estilo alterado:

.entry-content table{border: 1px solid #E7E7E7;margin: 0px 0px 0px 0px;text-align: left;width: 100%!important;}
.entry-content table td{padding: 1px 1px!important; border:1px solid #e9e9e9;}
.entry-content p img{margin:0px 0px 0px 0px!important;}

As alterações foram feitas nos valores em negrito. Por algum motivo, tais valores estavam ignorando o width 100%.

Abraço.

Moderador Míriam de Paula
(@miriamdepaula)

11 anos, 9 meses atrás

O padding com certeza influencia na largura dos elementos…

Que bom que deu certo!

Qualquer coisa estou sempre por aqui =)

Abs.

Miriam de Paula

Visualizando 8 respostas - 1 até 8 (de um total de 8)

O tópico ‘Editar formato das tabelas sem alterar o CSS’ está fechado para novas respostas.

Editar formato das tabelas sem alterar o CSS

Tags de tópico

Visualizações