Ir ao conteúdo
  • Cadastre-se

Problema com css


Posts recomendados

Estou tentando fazer um layout responsivo, fiz 4 divs, uma do lado da outra, mas quando vou diminuindo o browser a quarta div não diminui, ela cai para baixo.

Código em Html:
 

 
  <div id="estrutura">             <div id="tile">                    </div>               <div id="tile">                    </div>          <div id="tile">                    </div>                    <div id="tile">                    </div></div>  
 
 
Código em CSS:
 
 
  #estrutura{  max-width: 1400px;  width: 100%;  height: auto;  overflow: hidden;  background: #ccc;  margin: auto;  padding: 9px 0px 9px 9px;}   #tile{  max-width: 341px;  width: 29%;       height: 200px;  background: #ADADAD;  margin: 0px 9px 0px 0px;  float: left;}
Link para o comentário
Compartilhar em outros sites

Olá

 

Você definiu width: 29%;

Mas como são 4 divs vai dar erro porque 4x29% = 116%. ERRADO

o tamanho das DIV's deve somados deve ser igual ou menor que 100%, isso quando se esta trabalhando com tamanhos em %

como são quatro DIV's, para elas ficarem do mesmo tamanho elas devem ter no máximo 25% de largura.

 

Mas veja bem, você definiu uma margem de 9px para cada DIV e ainda um padding na div estrutura, essas margens ocupam espaço logo DIV's com 25% de largura tambem não cabem.

 

OU seja

 

defina uma largura menor, faça o teste com 22% 23% 21%.

Link para o comentário
Compartilhar em outros sites

Visitante
Este tópico está impedido de receber novas respostas.

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...