Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

nknk

Alinhamento de div (colunas)

Recommended Posts

Eu gostaria de obter a seguinte estrutura:

 

tabela (div)

coluna - coluna - coluna (class)

coluna - coluna - coluna

coluna - coluna - coluna

coluna - coluna - coluna

coluna - coluna - coluna

tabela (/div)

 

Estou utilizando este modelo:

 

#tabela{width:100%;height:700px;float:left;text-align:left}
#tabela .coluna{float:left;width:28%;margin:1%;padding:1%;}

Só que verifiquei que não funciona no opera, internet explorer - na maioria das versões. Algumas colunas ficam desalinhadas.

Compartilhar este post


Link para o post
Compartilhar em outros sites

posta um link?

 

#tabela{width:100%;height:700px;}

#tabela .coluna{float:left;width:28%;margin:1%;padding:1%;}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu gostaria de obter a seguinte estrutura:

 

tabela (div)

coluna - coluna - coluna (class)

coluna - coluna - coluna

coluna - coluna - coluna

coluna - coluna - coluna

coluna - coluna - coluna

tabela (/div)

 

Estou utilizando este modelo:

 

#tabela{width:100%;height:700px;float:left;text-align:left}

#tabela .coluna{float:left;width:28%;margin:1%;padding:1%;}

 

Só que verifiquei que não funciona no opera, internet explorer - na maioria das versões.

nknk veja se é mais ou menos isso abaixo, eu testei e funcionou em todos os navegadores:

 

ie6, ie7, opera, firefox e chrome

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>Untitled Document</title>
<style type="text/css" media="screen">
#tabela{width:100%;height:700px;float:left;text-align:left}
#tabela .coluna{float:left;width:28%;margin:1%;padding:1%; border:1px solid}
</style>
</head>
<body>
<div id="tabela">
<div class="coluna"></div>  <div class="coluna"></div>  <div class="coluna"></div>
<div class="coluna"></div>  <div class="coluna"></div>  <div class="coluna"></div>
<div class="coluna"></div>  <div class="coluna"></div>  <div class="coluna"></div>
<div class="coluna"></div>  <div class="coluna"></div>  <div class="coluna"></div>
<div class="coluna"></div>  <div class="coluna"></div>  <div class="coluna"></div>
<div class="coluna"></div>  <div class="coluna"></div>  <div class="coluna"></div>
</div>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tudo isso é errado!!!

 

se quer mostrar dados tabulares use uma tabela!!!!!!

 

e não tente simular tabela com div a não ser que isso seja necessario!

 

abraço

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tudo isso é errado!!!

 

se quer mostrar dados tabulares use uma tabela!!!!!!

 

e não tente simular tabela com div a não ser que isso seja necessario!

 

abraço

Quando é que uma simulação de tabela com div vai ser necessário?

 

nknk veja se é mais ou menos isso abaixo, eu testei e funcionou em todos os navegadores:

ie6, ie7, opera, firefox e chrome

Carlos Designer,

É isto daí, eu pensava que para postar estrutura não precisava de code.

Estas divs apresentam fotos e algumas das fotos ficam desalinhadas.

Eu já vi muitos sites que em <ul></ul> tem foto e descrição do lado, isto está correto? (baixaki do ig usa)

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tudo isso é errado!!!

 

se quer mostrar dados tabulares use uma tabela!!!!!!

 

e não tente simular tabela com div a não ser que isso seja necessario!

 

abraço

Quando é que uma simulação de tabela com div vai ser necessário?

 

 

Já ocorreu comigo de ter que fazer um calendario dessa forma porque existia um javascript que mandava gerar o calendario em div e span

 

essa é uma possibilidade!

 

abraço http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu já vi muitos sites que em <ul></ul> tem foto e descrição do lado, isto está correto? (baixaki do ig usa)

UL LI, são listas não ordenadas, fazer uma "listagem" de imagens com esses elementos, me parece mais semântico, e é com certeza "mais leve" do que fazer com DIVs.

 

LI é um elemento inline.

DIV é um elemento nivel de bloco.

 

Tantas DIVs assim sobrecarrega a página, a estrutura fica poluida.. Ai seria mais uma questão conceitual, acho.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Carlos Designer,

É isto daí, eu pensava que para postar estrutura não precisava de code.

Estas divs apresentam fotos e algumas das fotos ficam desalinhadas.

Eu já vi muitos sites que em <ul></ul> tem foto e descrição do lado, isto está correto? (baixaki do ig usa)

você quer fazer uma listagem de imagens?

 

eu fiz isso aqui usando divs : Exemplo

é mais ou menos isso que você quer fazer?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Sim.

 

Então, eu posso fazer listagem em div, ul e tabela, mas ul e tabela são os corretos?

Só para finalizar é possível com ul fazer uma listagem que fique como se fosse 3 colunas ? Como faz ? float:left e width:33%?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Sim.

 

Então, eu posso fazer listagem em div, ul e tabela, mas ul e tabela são os corretos?

Só para finalizar é possível com ul fazer uma listagem que fique como se fosse 3 colunas ? Como faz ? float:left e width:33%?

perfeitamente!

 

cuidado apenas com o modelo caixa!

 

abraço

Compartilhar este post


Link para o post
Compartilhar em outros sites

Era para eu ter postado neste topico a respeito do <br> em <li>. Mas a respeito do que propus neste topico. Tenho feito a listagem de imagens com ul e li, lado a lado acho mais rapido.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.