Expressá-la

Em várias ocasiões, ao fazer layouts de páginas com divisões popup / lightboxes / dicas etc nos deparamos com situações em que alguns objetos de formulário Select passa a ser sob estas divisões POPUP, pelo projeto e mostra através de .... YUK!

Bem! você pode facilmente corrigir isso ajustando seus Z-INDEX valores adequadamente para FF e IE7. Mas Good Old (trocadilho intencional) IE6 não se comportar conforme o esperado .... O show BOX SELECT através de, mesmo depois de aplicar alguns drasticamente elevados Z-INDEX valores para a sua Divisão de PopUp ... Bummer!!

Não existem soluções para este problema, mas há, creio eu, mais de uma maneira que poucos a trabalhar em torno deste problema, mas estou aqui para dizer-lhe a solução mais simples que eu uso, que funciona bem para mim, na maior parte do casos ....

"Esconder o ROUGE caixa SELECT quando você mostra a POPUP"

Simplesmente em seu trecho de script onde você mostrar o seu pop-up, adicione um pedaço de script para definir a visibilidade da caixa de seleção para "Hidden"

document.getElementById ('my_select') style.visibilty = "hidden".;

E lembre-se de configurá-lo de volta no próximo da sua Divisão de PopUp

document.getElementById ('my_select') style.visibilty = "visível".;

onde "my_select" é o ID da caixa de irritação SELECIONAR

Espero que isso ajude ...

PS. Existem outras opções como ofcourse dinamicamente positionining um IFRAME (mesmo tamanho que você PopUp), sob a DIV Popup ... Isso funciona muito bem, mas com uma adição de cargas de elementos DOM, scripts e dor de cabeça. Eu tenho usado essa solução também, e Se você precisar de alguma ajuda com esta opção, deixe-me saber. Será um prazer ajudar!

Por idades, tenho de pensar para consolidar todas as melhores práticas, fui ler de vez em quando. Finalmente! Eu tive até colocá-lo para caneta. Eu percebi que vai ser tarefa gigantesca de criar este documento mamute, então eu decidi dedicar toda uma categoria para ele, para que eu pudesse continuar a acrescentar coisas sobre as melhores práticas de como e quando eu encontrá-los ...

Bem! o conteúdo aqui será uma amálgama de minhas práticas UI pessoais Melhores desenvolvimento com aqueles escritos pelos desenvolvedores do padrão, como Yahoo, Google etc etc

Assista a este espaço e manter browing a melhor categoria Práticas

A redefinição CSS é / são CSS para definir um número de estilos de elementos para uma linha de base específica que cria consistência entre vários navegadores.

Todos nós temos sido através dos pesadelos de escrever CSS cross-browser do. Então, quando começamos a escrever nosso CSS, É uma prática para redefini-la primeiro para remover / redefinir as inconsistências cross browser. Redefine CSS, são simples linhas de CSS que você começa o seu CSS com, dando-lhe uma base limpa para começar a construir o seu em cima.

O redefine CSS que normalmente tendem a usar esta aparência

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
margin:0;
padding:0;
}
html {font-size: 76%;}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset, img {
border:0;
}

ul, ol {
list-style: none;
}

h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: normal;
}

Redefinir o tamanho da fonte navegador
Além disso, note a reposição que tem sido aplicado ao tamanho do navegador de fonte na linha seguinte ...

html {font-size: 76%;}

O CSS acima redefine o tamanho da fonte navegador para 10 pixels, o que torna possível trabalhar com tamanhos de fontes relativos (que é todo importante a partir de um acordo WAI prespective)
Por exemplo, na seguinte definição, tamanho da fonte em um período é definido como 10 pixels e que na do n ° é definida como 14 pixels ...

span {font-size: 1em;}
p {font-size: 1.4em;}