Colunas

MTavares · Abril 24, 2012

Olá pessoal,

estou aqui com uma dúvida do qual esbarrei exatamente em algo que vira e mexe é briga feia :lol: . Estou querendo pegar os resultados de um banco e dividir em 3 colunas. Sei fazer isso na velha amiga tabela, mas em tableless (acho que é assim que se escreve) não estou conseguindo. Alguém poderia de dar essa força? dividir em 3 colunas mas que se ajustem conforme a tela? Na verdade o meu problema não é de CSS exatamente, mas sim PHP, ou seja, estou no fórum correto ;) . vejam abaixo uma das 10000000000 tentativas...

<style type='text/css'>
    #pagina { width: 100%; }
    #colunaDiv { width: 250px; float: left; height: 350px; }
</style>

<?php
.....
      $coluna = 2;
     echo "<div id='pagina'>";
      
     for ($c = 1; $c < $coluna; $c++):

        while($registro = mysql_fetch_array($sql)):
                echo "<div id='colunaDiv'>$registro[produto]</div>"; 
        endwhile;
    endfor;     
     echo  "</div>";
?>

Obrigadão!!!!

jissa · Abril 25, 2012

crie um php separado tipo colunas.php coloque o codigo(abaixo) e teste, vai quebrar em 3 colunas..

depois que ver que funciona pode mudar, na variavel $coluna pode colocar quantas colunas vai querer, e no for coloque seu while do Banco de dados..

<tr>

<?

// número de Colunas

$colunas = 3;

//ajuste do inicio

$i = 1;

// verificador para contagem, aqui troque pelo seu laço do DB

for($testeColuna=0; $testeColuna < 10; $testeColuna++ )

{

$resto = $i%$colunas;

?>

</td>

<?

if($resto == 0){

echo "</tr>";

echo "<tr>";

}

$i++;

}

// Se o $resto for diferente de 0, fecha a linha da tabela, com o </tr>

if($resto != 0){ ?>

<? } ?>

</table>

**Editei adicionando o $i = 1; para começar certo, estava colocando o 0 na primeira e depois ajustava.. com o $i = 1 fica certo

Editado Abril 25, 2012 por jissa

MTavares · Abril 25, 2012

Olá jissa,

na verdade, com tabelas eu sei fazer, porém o site está todo em CSS, por isso gostaria de usar o tableless.

Abraços

MTavares · Abril 25, 2012

Consegui encontrar uma solução. Como aqui é uma troca de experiências, segue abaixo o link do qual o colega mostra com divs e tabelas. A lógica é simples, veja:

<style type="text/css">
.container{  width: 400px;}
.div_imagem{  float: left;  width: 100px;}
</style>
<body>
<div class="container">
<?php 
for($i = 1; $i <= 100; $i++){ ?>  
<div class="div_imagem">
Dados <?php print($i); ?>
</div>
<?php } ?></div>
</body>

Vale ressaltar que para funcionar, ele colocou o container como exemplo, porém se você colocar outras informações dentro dessa div, poderá dar erro. Por isso é aconselhável usar da seguinte forma:

<style type="text/css">
.produtos{  width: 400px;}
.div_imagem{  float: left;  width: 100px;}
</style>
<body>
<div class="produtos">
<?php 
for($i = 1; $i <= 100; $i++){ ?>  
<div class="div_imagem">
Dados <?php print($i); ?>
</div>
<?php } ?></div>
</body>

Assim não ficamos reféns de outras divs e podemos criar o container sem dar problemas no layout. Segue abaixo o link do nosso colega.

http://forum.wmonline.com.br/topic/151558-...dos-em-colunas/

Abraços

Editado Abril 25, 2012 por MTavares

Entrar

Colunas

Pergunta

MTavares

Link para o comentário

Compartilhar em outros sites

3 respostass a esta questão

Posts Recomendados

jissa

Link para o comentário

Compartilhar em outros sites

MTavares

Link para o comentário

Compartilhar em outros sites

MTavares

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades