Ir para conteúdo

POWERED BY:

Arquivado

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

Kewz

Problema com Divs

Por , em Desenvolvimento frontend

Recommended Posts

Kewz    0

Kewz
Postado

Olá a todos!

Estou tentando fazer com que três DIVS fiquem em 100% (com a soma de todas) através do seguinte código

 

<!--#esquerda, #direita {		width: 20%;		background: #CCC			}#centro {		width: 60%;		}div {		font: 70%, verdana;		padding: 5px;		float: left;		}--></style></head><body><div id="esquerda">Esquerda</div><div id="centro">Centro</div><div id="direita">Direita</div>

Porém a div "direita" sempre pula para baixo da div esquerda, como se não tivesse espaço para ela do lado da DIV do centro.

Como resolver isso?

Já tentei usar px nos tamanhos e até que funcionou, porém a DIV não aumentaria e diminuiria conforme a resolução do usuário.

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

olha rapaz, trabalhar com tamanhos relativos, da maneira como você quer eh bem complicado, pois limita em algumas coisas...

 

Por exemplo o padding, margin... a partir do momento que você utiliza, você estará modificando o tamanho totaldo div... por isso naum eh recomendavel sua utilização...

 

Um jeito de se conseguir fazer o q você quer eh faendo a seguir:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Relativo</title><style type="text/css">body { margin: 0; padding: 0; }#esquerda, #direita {width: 20%;background: #CCC}#centro {width: 60%;background: #999999;}#esquerda, #direita, #centro {font: 70%, verdana;float: left;}</style></head><body>	<div id="esquerda">esquerda</div>	<div id="centro">meio</div>	<div id="direita">direita</div></body></html>
:natalwink:

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

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

  Aceito