Width:Auto; - IE6

[Fernando_ramos 0]

Amigos,

Bom dia.

 

Estou com uma dúvida quanto a largura de uma div.

 

Vamos lá. O endereço para visualização é: http://sistema.personalliconsultoria.com .

 

Ao abrir no FF,OPERA,NETSCAPE,FLOCK,SAFARI e até no IE8 fica legal a div de login fica centralizada.

 

Porém no IE7 e IE6 a minha div de login fica alinhada na esquerda.

 

a estrutura é:

 

<div id="Conteudo">
	   <div class="Caixas">
	   </div>
	</div>

 

no CSS está assim:

 

#Conteudo{
	height:auto;	
	padding: 20px;
	margin: 0 auto;
	text-align:center;
}
.Caixas{
	width:auto;
	padding: 5px 0 5px 0;
	margin: 0 auto;
	text-align:left;
	display:table;
	position:relative;
}

no Dreamweaver, em design eu percebo que esta div que tem a classe "Caixas" esta dimensionado para ocupar todo o espaço da div com ID "Conteudo". Mas eu queria que ela ocupasse apenas o espaço necessário ao conteúdo dela. Tentei colocar na classe "Caixas" position:absolute, até ficou com o tamanho certinho, mas estragou o layout, ficou por cima de outras Divs.

 

 

abraços e agradeço desde já!

[Thiago Retondar 18]

O que acontece, é que a o Internet Explorer 6 não entende a propriedade display: table, sendo assim terá de usar width com valor fixo, ou procurar uma solução em JavaScript.

 

Não visualize seu site pelo Dreamweaver. Ele melhorou muito, mas ainda erra bastantes. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Fernando_ramos 0]

Certo.

 

Mas não existe uma outra alternativa em CSS para fazer o que eu preciso?

[Thiago Retondar 18]

De cabeça eu não conheço nenhuma solução. Tente achar algo em display:table ie hack.

[William Bruno 1501]

^_^

 

Interessante lembrar do hack para centralizar horizontalmente no IE5..

text-align: center, e left....

.Caixas {
	width:auto;
	padding: 5px 0 5px 0;
	margin: 0 auto;
	display:table;
	position:relative;
}
.Caixas h2{
	text-align: left;
	width: 120px;
}
.Caixas form {
	width: 120px;
	text-align:left;
}

:lol: o text-align, tava jogando o elemento pra esquerda.. por isso que aparentemente não funcionava o width: auto..

só acontece no IE, por causa desse maravilhoso bug, de alinhar elementos com a propriedade text!

[Fernando_ramos 0]

William,

Boa tarde.

 

Funcionou legal. Porém tem como a largura não ser fixa? Por que terei outros forms e H2 no projeto e não serão do mesmo tamanho! abraços!

[Thiago Retondar 18]

Ter, até tem. Foi o que eu disse.

 

Tente usar algum hack ou JavaScript para "emular" o display: table.