input type="text" descentralizado no internet explorer

[Guilhermej 1]

Bom dia,

Há algum comando que eu possa usar para resolver esse problema?

#pesquisa{
height:28px;
width: 300px;
border: solid 1px black;
margin: 9px 0px 0px 0px;
float: right;
padding: 0px 5px;
outline: none;
text-transform: uppercase;
font: 19px normal Arial, sans-serif;
}

[Ricardo Barantini 33]

<!--[if lt IE 9]>
<style>
#pesquisa{
height:28px;
width: 300px;
border: solid 1px black;
margin: 9px 0px 0px 0px;
float: right;
padding: 5px 5px 0px 5px;
outline: none;
text-transform: uppercase;
font: 19px normal Arial, sans-serif;
</style>
<![endif]-->

[Guilhermej 1]

Olá ricardo,

O problema desse comando é que ele aumenta a caixa de pesquisa como um todo, o texto desgruda de cima, mas ainda fica descentralizado, porque aumenta a parte de baixo tb, e é preciso modificar o submit para o mesmo tamanho, porém acho que essa vai ter que ser a "solução" mesmo, obrigado.

[Ricardo Barantini 33]

O certo é fazer um css a parte pro IE e nele ir alterando tudo o que precisa alterar para ficar igual aos outros navegadores. Isso já é um início, é só fazer o restante agora.

[Guilhermej 1]

Realmente não tinha pensado desse jeito, foi só tirar do height os pixels adicionados no padding. Só não sei como chamar o css especifico para o explorer através da tag <link>, tenho que nomear o arquivo de um jeito diferente? e quando específico <!--[if lt IE 9... funciona em todas versões anteriores ou somente para o 9? Muito Obrigado.

[Ricardo Barantini 33]

Você chama ele normalmente com o <link> porém dentro da tag.

 

<!--[if lt IE 9]><![endif]-->

 

E sim, tem que ser um arquivo a parte, geralmente uso o padrão como "style.css" e os alternativos como "style-ie6.css", "style-ie7.css" e assim por diante.

 

A tag if lt IE 9 significa que funciona do 9 até os anteriores, mas existem vários outras tags, você pode conferir todas aqui. :thumbsup:

[André do Vale 76]

Voltando ao código inicial, e sem alterar seu espaçamento interno (padding), você podia regular a altura da linha com a mesma altura do elemento (o input do tipo texto é por natureza "box-sizing: border-box"), acrescendo:

 

line-height:28px

 

Ou alterando:

 

font: normal 19px/28px Arial, sans-serif;