[Resolvido] div com altura mínina....

[cassiano óliver 1]

É possível estabelecer uma altura mínima para uma div?

por ex:

 

Ela tem que ter no mínimo 300px de altura, mas caso o conteudo não caiba nos 300px, ela aumente automaticamente?

tem como fazer isso?

 

no aguardo...

[inforsis 1]

Olá cassiano óliver, Boa Tarde!

Faz uma pesquisa sobre a propriedade:

min-height - Que define uma altura minima para um elemento.

Qualquer nova dúvida volte a postar. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[cassiano óliver 1]

boa noite inforsis,

vlw mesmo pela ajuda...

era isso mesmo que tava precisando....

 

só que no IE6 pra variar, não ta funcionando...

div {
	 min-height: 500px; /* ALTURA MÍNIMA, PARA O FF */
	 height: 500px; /* ALTURA MÍNIMA, PARA O IE6 */
	 height: auto !important; /* ASSIM A DIV AUMENTA CASO O CONTEÚDO ULTRAPASSE A ALTURA MÍNIMA */
}

div {
	 min-height: 500px; /* ALTURA MÍNIMA, PARA O FF */
	 _height: 500px; /* ALTURA MÍNIMA, PARA O IE6 */
	 height: auto !important; /* ASSIM A DIV AUMENTA CASO O CONTEÚDO ULTRAPASSE A ALTURA MÍNIMA */
}

no head

<!--[if IE6]>
<style>
#ConteudoEsquerdo {
	height: 680px;
}
</style>
<![endif]-->

nenhuma dessas formas ta funcionando no IE6...

[cassiano óliver 1]

resolvido!

 

<!--[if IE6]>
<style>
#ConteudoEsquerdo {
	height: auto !important;
}
</style>
<![endif]-->

[inforsis 1]

cassiano óliver, Boa Noite!

Isso aí que bom que conseguiu resolver o problema, fico feliz em ver que uma pequena base te fez pesquisar e ampliar seus conhecimentos com a resolução do problema, e retornou para nos informar. Esse é o espirito do fórum. Continue assim.

Qualquer nova dúvida volte a postar. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Nícolas 4]

Ta ja foi resolvido... mas da pra ficar melhor

http://www.dustindiaz.com/min-height-fast-hack/

 

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

[cassiano óliver 1]

inforsis

assiano óliver, Boa Noite!

Isso aí que bom que conseguiu resolver o problema, fico feliz em ver que uma pequena base te fez pesquisar e ampliar seus conhecimentos com a resolução do problema, e retornou para nos informar. Esse é o espirito do fórum. Continue assim.

Qualquer nova dúvida volte a postar...

vlw...

eu é que agradeço...

 

 

 

nick171...

foi assim mesmo que tentei, mas no ie6 não rolava...

 

mas vlw pela ajuda!

[Nícolas 4]

inforsis

assiano óliver, Boa Noite!

Isso aí que bom que conseguiu resolver o problema, fico feliz em ver que uma pequena base te fez pesquisar e ampliar seus conhecimentos com a resolução do problema, e retornou para nos informar. Esse é o espirito do fórum. Continue assim.

Qualquer nova dúvida volte a postar...

vlw...

eu é que agradeço...

 

 

 

nick171...

foi assim mesmo que tentei, mas no ie6 não rolava...

 

mas vlw pela ajuda!

 

 

Não funcionou porque em programação A ORDEM DOS FATORES ALTERA SIM O PRODUTO, hehehhe

 

Se você para para ver a leitura do navegador.

 

min-height: 500px; /* ALTURA MÍNIMA, PARA O FF */
	 height: 500px; /* ALTURA MÍNIMA, PARA O IE6 */
	 height: auto !important; /* ASSIM A DIV AUMENTA CASO O CONTEÚDO ULTRAPASSE A ALTURA MÍNIMA */

A leitura ta sendo assim

 

 

 

IE

min-height: 500px;... internet explorer não interpreta

height: 500px;... da 500px de altura pra div

height: auto !important;... tira os 500px de altura e troca por automático, mas não porque é !important mas pela ordem da leitura

RESULTADO: Não funciona no IE porque a altura está automática

 

 

 

FIREFOX

min-height: 500px; ... Da a altura minima de 500px para a div

height: 500px; ... da a altura de 500px (o que cancelaria o min-height pois trocaria uma altura relativa por uma fixa)

height: auto !important; ... da a altura automatica e graças ao !important e a ordem da leitura pois sendo o segundo ele ignora os 500px jogados na linha de cima.

RESULTADO: Funciona no firefox pq a altura minima está setada e o height esta automatico

 

 

 

O comando !important não é lido pelo IE... o Internet Explorer le o valor jogado na linha mas não prioriza ela como importante.

 

Ja o Firefox, Opera e etc sim.

 

 

Então você ta dando o valor de 500px para o IE e tirando logo em seguida.

 

O correto seria você fazer assim.

 

min-height: 500px; /* ALTURA MÍNIMA, PARA O FF */
	 height: auto !important; /* ASSIM A DIV AUMENTA CASO O CONTEÚDO ULTRAPASSE A ALTURA MÍNIMA */
	 height: 500px; /* ALTURA MÍNIMA, PARA O IE6 */

Porque a Leitura seria a seguinte.

 

 

IE

min-height: 500px;... internet explorer não interpreta

height: auto !important;... altura da div automatica

height: 500px;... sobescreve o valor automático e muda para 500px de altura inicial.

RESULTADO: Funciona no IE porque o ultimo valor que ele leu foi height: 500px...

 

 

 

FIREFOX

min-height: 500px;...Da a altura minima de 500px para a div

height: auto !important;... da a altura automatica pra div e declara esse valor como o height mais importante desse bloco de código.

height: 500px;... da a altura de 500px para a div mas será ignorado porque a linha de cima é a mais importante

RESULTADO: Funciona no Firefox pq a altura minima está setada embora o último valor setado para o height tenha sido 500px o automático que é dado como importante, sendo assim ele ignora o 500px.

 

 

A lógica desse código é essa.

 

 

Bom é isso cara, espero que tenha dado pra entender

 

 

^_^

 

Flw aeee

[cassiano óliver 1]

ótima explicação!

 

Realmente funcionou, até tirei o comentário condicional!

 

vlw nick...