Tabela dentro de uma div

[cdmafra]

Olá!

O meu site gera cada artigo numa div com a classe CSS "panel".

Acontece que o texto quebra normalmente consoante os ecrãs, cumprindo o responsive design. Contudo, as tabelas saltam para fora da div em ecrãs mais pequenos.

Como posso contornar o problema em termos de estilos CSS para as tabelas?

Obrigado desde já!

[HappyHippyHippo]

se o conteúdo de um bloco não pode ser redimenssionado em largura, então o contentor exterior também não pode ser ajustado, seja ele uma tabela ou um outro boloc qualquer.

pela pequena descrição do problema, o que parece acontecer é o que descrevi anteriormente, por alguma razão, o conteúdo não pode ser redimenssionado.

[bioshock]

Tens de tornar as tabelas também responsive.

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_table-responsive&stacked=h

[cdmafra]

Supostamente tenho as tabelas responsive...

[bioshock]

E é suposto eu saber o teu código ou vais-nos apresentá-lo?

Utiliza o JSFiddle.

[HappyHippyHippo]

E é suposto eu saber o teu código ou vais-nos apresentá-lo?

sim ... como podeste presumir outra coisa ?

[bioshock]

Não sei, às vezes dá-me para estas coisas. 😄

[cdmafra]

O meu código PHP (o que interessa, é o news_post dentro da <div> do panel em que as tabelas aparecem).

<div class="panel">
<div class="row"><h3 class="n4"><?php echo $row["news_title"]; ?></h3>
 </div>
<p id="data"><?php echo $row["news_date"]; ?>, <?php echo$row["hour"] ;?> WET/UTC<br/><?php if ($row['copyright'] <> 'Desconhecido')    echo "Copyright Imagem: " . $row['copyright'] ;?></p>
<p><?php echo $row["news_post"]; ?>

O meu código CSS, no JSFiddle aqui

[bioshock]

O código PHP não interessa para nada.

Fizeste bem em colocar o JSFiddle, mas não é suficiente apenas colocares lá o CSS. Faz uma estrutura exemplo de como apresentas o teu produto final.

Depois nesse teu código não vejo nenhuma tabela (estamos a falar dos elementos table correcto?) e por fim, se estás preocupado com a ocorrência do output da imagem abaixo:

Tens de trabalhar com as media-queries para que possas reduzir a fonte consoante o tamanho.

[cdmafra]

Fiddle actualizado.

Entretanto, penso ter descoberto a causa do problema.

Na edição dos artigos uso o CKEditor, que me redimensiona as tabelas para uma largura fixa (dá-me um inline style com width a cada tabela). Se eu alterar à mão para uma width de 100%, por exemplo, aparece-me a tabela total em ecrã de PC e com scroll em ecrã móvel.

Edited April 16, 2015 at 09:19 AM by cdmafra

[bioshock]

Eu tive que adivinhar o teu fiddle..porque sempre que fazes uma actualização ao fiddle é alterado o url.

Adiante, isso foi o que eu te disse. Se tivesses visto o link que te coloquei na primeira instância e inspeccionado a tabela que lá está já tinhas chegado a essa conclusão.