Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá amigos!
Estou tentando fazer um site com uma estrutura 3 x 3.
Quase como esse exemplo, mas com três linhas: (como se tivesses três dessas uma sobre a outra)
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.semantico.com.br/artigos/imagens/layout1.gif&key=34c50ba5b0f6284b90c1cbc8c5a22c57e4ad79977b7239b4fde8a3c0707d7904" alt="layout1.gif" />
São três colunas e três linhas.
Foi tão fácil fazer usando uma tabela, o problema é que esta impossível replicar o efeito usando DIVs.
O conteúdo do site é dinâmico na coluna do centro o texto é inserido, quando tem mais texto a tabela muda de tamanho e as três colunas acompanham, mas usando DIVs, cada DIV se movimenta separadamente.
Já tentei usar uma DIV no fundo e usar o min-height 100% e height 100%, de modo que os DIVs aumentem na totalidade da DIV de fundo, infelizmente isso só funciona com o DIV do centro, os DIVs laterais continuam menores do que ele.
Cheguei a conclusão de que é impossível replicar o comportamento da tabela. Estou errado?
Como posso resolver meu problema? Abandono o tableless e uso a tabela ou troco de layout?
>
basta utilizar uma técnica chamada Faux Columns.
Putz, o problema é que a minha estrutura vai ter três andares.
Não é um layout simples de 3 colunas, ele além das colunas vai ter 3 linhas.
Acho que usar as tabelas vai ser mesmo a solução, muito embora o dado não seja tabular acho que nesse caso o tableless vai ter que ficar de fora.
Dai pelo que entendi você quer que as divs se ajustem conforme a resolução. Pra fazer isso você precisa trabalhar com % (porcentagem), fiz um exemplo da uma olhada vê se é isso que você precisa: VEJA O EXEMPLO
>
Dai pelo que entendi você quer que as divs se ajustem conforme a resolução. Pra fazer isso você precisa trabalhar com % (porcentagem), fiz um exemplo da uma olhada vê se é isso que você precisa: VEJA O EXEMPLO
Olá amigo, infelizmente não funcionou aqui com o efeito que eu preciso.
Achei uma solução tableless, fazer as DIVs se comportarem como tabelas.
O problema é que a compatibilidade falha em alguns navegadores.
A solução tableless segue abaixo, mas achei estupida, pois trata-se de trocar seis por meia duzia e ainda trás problemas... É melhor eu começar a repensar esses conceitos de tableless, pois já começo a ver varias falhas no conceito em si.
#div_table{
display: table;
border-color: blue;
border-style:solid;
border-width:5px;
}
#div_td{
display: table-cell;
border-color: blue;
border-style:solid;
border-width:5px;
}
#div_tr{
display: table-row;
border-color: blue;
border-style:solid;
border-width:5px;poste um print do seu layout, pois até onde 'visualizei' pensando, dá para resolver muito facilmente aplicando Faux Columns.
A falha não está no conceito do paradigma Tableless, mas no nosso conhecimento para aplica-lo corretamente.
basta utilizar uma técnica chamada Faux Columns.