Quem trabalha com css e html eventualmente descobre algumas pequenas perolas em browsers habitualmente bons que nos levam a dar em doidos ao tentar perceber o seu porquê. Já vos falei aqui dos 3px de letter-spacing impossíveis de remover e hoje venho deixar-vos mais dois, um do Gecko (Firefox) e outro do Webkit (Safari, Chrome).
Webkit: Tamanho do <select multiple="multiple" size="x">
Na especificação do HTML5 pode-se ler o seguinte:
The size attribute gives the number of options to show to the user. The size attribute, if specified, must have a value that is a valid non-negative integer greater than zero. If the multiple attribute is present, then the size attribute’s default value is 4. If the multiple attribute is absent, then the size attribute’s default value is 1.
O que indica que qualquer tamanho superior a zero é valido para o elemento selected com a opção multiple porém isto não é verdade em webkit. De acordo com o projecto webkit isto é um desvio intencional dos padrões que “melhora a usabilidade”! Não estou a brincar, se não acreditam em mim leiam o bug no projecto webkit ou o mesmo bug no projecto chromium.
Portanto ficam avisados, se alguma vez quiserem fazer um select, multiple com espaço para 2 ou 3 entradas podem tirar o cavalinho da chuva que não vai funcionar para cerca de 15 a 25% dos vossos visitantes.
Gecko: line-height num elemento <input type="button">
Não é só o Webkit que tem coisas aparentemente absurdas, o Gecko também tem as suas coisas parvas. Um exemplo disso é este “bug” com o line-height de botões.
Ao tentar mudar o line-height de um botão deparei-me com o facto de este estar preso a 15px (na realidade normal) e ser impossivel de mudar mesmo com uma regra !important. Na realidade está tudo a funcionar conforme a spec e o que se passa é que o css default do browser, que se sobrepõe a qualquer imposto pelo site ou pelo utilizador, possui o seguinte código:
button, input[type="reset"], input[type="button"], input[type="submit"] {
line-height:normal !important;
}E pronto, é impossível em firefox 3 mudar o line-height de um botão. Felizmente existe já um bug report e não está fechado com uma desculpa de “melhorar a usabilidade” por isso ainda há esperança mas mesmo assim é bom ter isto em atenção.