Por que isso "width: auto" trabalho estilo como um estilo inline em ambos os navegadores, mas quebrar quando mudou-se para uma folha de estilo externo somente no IE?

votos
0

Eu tenho um elemento de entrada que está inadimplente com width: 100%. Isto faz com que ele empurra outros elementos próximos a ele para baixo para a próxima linha. Para corrigir esse temporariamente eu adicionei um atributo estilo embutido no elemento como este:

<input style=width: auto ...>

que funcionou muito bem. Agora eu vou voltar para limpar as correções temporárias e eu estou movendo todos os estilos de atributos de estilo para estilo externas. Quando eu mover este width: auto estilo particular para a folha de estilo ainda parece bem no Firefox, mas no IE ignora-lo e padrões para width: 100% novamente que sopra elementos ao lado dele novamente.

A barra de ferramentas desenvolvedor web IE não me diz onde os estilos são provenientes, por isso é difícil de diagnosticar o que está acontecendo. Meu melhor palpite é que há algo mais tendo precedência no IE, mas eu não sei o que poderia ser.

Edit: Eu juro que tentei clique com o botão direito na barra de desenvolvedor IE mas acho que não - quando eu faço style trace na width: 100% no IE eu recebo um pop-up que apenas diz 1. No jogo, no entanto em Fogo mostrou-se que a 100% foi de sangramento através de um selector em que um elemento de cima era algo como barra #outer foo ENTRADA, que coberto esta entrada também. Eu engano supor que um #id diretamente no elemento INPUT teria uma maior especificidade do que foo bar #id INPUT mas eu acho que os navegadores discordam sobre isso. De qualquer maneira, isso tem a raiz do meu problema, por isso obrigado pelos comentários. Eu gostaria que houvesse uma forma de promover um comentário a uma resposta ...

Publicado 10/12/2008 em 06:15
fonte usuário
Em outras línguas...                            


1 respostas

votos
2

Você está absolutamente certo de que suas regras não são conflitantes ou na ordem errada (e da mesma precedência) anulando-se mutuamente?

Uma coisa que você pode tentar além sugestão de John Sheehan é aplicar um ID para o elemento de entrada, e, em seguida, fazer uma regra em sua folha de estilo que acrescenta largura: auto para esse elemento através do seletor de ID.

Dessa forma, a regra terá maior precedência e é mais provável de ser aplicada. Isto lhe dará uma idéia melhor de onde está o problema.

EDIT: Considerando suas atualizações, a regra que estava causando sua dor está funcionando como deveria (tanto quanto especificidade está em causa). Se você quiser resolver o seu elemento especificamente você ainda pode escrever uma regra com forte especificidade com algo parecido com isto:

#outer foo bar INPUT#id {
  width:auto;
}

Se você está escrevendo CSS como este, no entanto, as chances são de que você tenha feito algo errado e pode querer re-pensar como você estruturou suas regras CSS.

Respondeu 10/12/2008 em 08:36
fonte usuário

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more