Definir a altura de um
https://stackoverflow.com/questions/1614206
-
06-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianPergunta
Eu tenho um problema estranho com HTML escolha altura da caixa no Firefox 2, aqui está o código:
<!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" xml:lang="en" lang="en">
<head>
<title>FIREFOX 2 SELECT BOX HEIGHT ISSUE</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body { margin: 0; padding:0 ;}
div { height: 20px; background:red; float: left; overflow: hidden; }
select { height: 20px; width: 100px; }
</style>
</head>
<body>
<div>Should be same height as </div>
<select><option>this</option></select>
</body>
</html>
A altura é de 2 pixels maiores - de preenchimento, tamanho da fonte e altura de linha não parece ter qualquer efeito sobre ele e eu corri para fora de idéias e lugares para olhar. Devo assumir que altura real seleto de caixa no FF2 é sempre altura css + 2? Posso corrigi-lo ou trabalhar em torno dele?
Solução
Bem-vindo ao maravilhoso mundo do styling controle de formulário.
Sem querer derrotista som, eu acho que você deve simplesmente desistir. Não importa como você controles de formulário estilo sempre haverá navegadores que ignoram totalmente os seus estilos. Acredito Safari ignora a maioria CSS. Veja ' denominar selecione elementos ' em 456 Berea Street por exemplos.
Existem alternativas usando Javascript - Acredito jQuery UI tem alguns widgets semelhantes ao elemento select. Você também pode usar este jQuery menu do botão e anexar uma função que define o valor de um campo de entrada oculto. Já fiz isso antes e ele funciona muito bem. Este tipo de coisas são a única maneira que você vai ter controle total sobre o tamanho e aparência.
Outras dicas
Pode haver alguns padrões do navegador em jogo. o que acontece id você usar um de reset CSS e depois aplicar seus estilos? É ainda 2px off?
Dê-se sobre o uso de CSS para o estilo dele. Abrace jquery / javascript.
Você vai querer criar suas próprias imagens, e usar o evento clique dessas imagens para alternar as entradas de formulário reais. Essas entradas de formulário deve ser em um visor recipiente denominado: nenhum. Dessa forma, você pode projetá-lo como quiser.
Aqui está um bom artigo sobre o tema: http: //www.noupe. com / css / form-elementos-40-cssjs-denominando-e-funcionalidade-techniques.html
