Ir para conteúdo

POWERED BY:

Arquivado

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

Gilberto Jr

Altura total de pixel do monitor

Por , em Desenvolvimento frontend

Recommended Posts

Gilberto Jr    26

Gilberto Jr
Postado

Bom dia.

 

Seguinte, se eu criar uma div

<div id="conteudo">abc</div>

o no meu css eu colocar

#conteudo{width:100%;}

ele vai pegar o tamanha da largura do monitor.

 

Mas a minha duvida é na altura, se eu colocar

#conteudo{heigth:100%;}

não funciona. Existe alguma solução pra isso?

 

Att;

Compartilhar este post

Link para o post
Compartilhar em outros sites

Vinicius Rangel    208

Vinicius Rangel
Postado

depende, a regra é que ele é 100% em relação ao pai dela, tanto height com width .

 

ele se adapta ao monitor pelo fato de que o body se ajusta a cada resolução, agora se sua div tiver dentro de outra com um width e height definido ele vai ser 100% em relação ao pai dela e não mais ao body.

 

o height funciona "perfeitamente", pode ocorrer alguns erros no ie que fica um pouco maior ai vc tem que definir 99.7% por ai

Compartilhar este post

Link para o post
Compartilhar em outros sites

Gilberto Jr    26

Gilberto Jr
Postado

Eu estou fazendo o seguinte teste e não esta funcionando.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Teste de Div</title>
<style type="text/css">
#conteudo{
	height:100%;
	width:100px;
	margin:auto;
	background:#0F9;
}
</style>
</head>

<body>
<div id="conteudo">
</div>
</body>
</html>

 

Pq?

 

Att;

Compartilhar este post

Link para o post
Compartilhar em outros sites

Public2004    79

Public2004
Postado

Você precisa definir a altura do "body" também em 100% que no caso seria o "pai" da sua div "coneudo", em outras palavras como o Vinicius já havia comentado, ex:

html, body {
    width:100%;
    height:100%;
    margin:0 auto;
}

Att.

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