Alterar largura de todos os elementos selecionados que são descendente de uma div id = “content”
-
21-08-2019 - |
Pergunta
Eu estou tentando estilo de todos os elementos <select>
que são um descendente de um <div>
. Eu poderia ter um colocar uma aula sobre eles, mas eu estava tentando ser inteligente: -)
Eu acredito que ele não funciona no IE6 mas isso funciona no IE7 etc?
Como você fazê-lo
Aqui está um dos meus seleciona (não tem classe ou id), mas todos eles são descendentes de uma div cujo id é "conteúdo"
<div id="content">
<select >
<option></option>
</select>
</div>
Todas as idéias?
Solução
Se você quiser alguma escolha que é descendente de um elemento com id = "content":
#content select { ... }
Se você quiser alguma escolha que é um descendente direto de um elemento com id = "content":
#content > select { ... }
Se você quer limitá-lo a apenas elementos div com id = "content":
div#content select { ... }
O segundo pode não funcionar em alguns navegadores mais antigos, mas os outros devem trabalhar em até mesmo um navegador antigo, desde que ele tem qualquer apoio css em tudo, como o Netscape 4.
Outras dicas
Isso deve funcionar em todos os navegadores:
#content select {
// Styles for selects inside the div with id `content'
}
.myDiv select {
font-family:verdana;
}
<div class="myDiv">
<p><select>...</select></p>
<p><select>...</select></p>
</div>
div#content > select {
}
.content select {
css here
}
Eu acredito que esta é a forma como você pode fazer isso. Onde "conteúdo" é a classe do seu div. Isso irá formatar todos os seleciona dentro de uma div que tem a classe de "conteúdo".
O melhor de sorte!
A solução de Nick só fica descendentes diretos, por isso não iria ficar um seleto em um formulário no div. Isto irá levá-los, não importa quantos outros elementos profunda são:
#content select { width: 100px }
Se você só deseja obter, por exemplo, as entradas de texto que você pode fazer isso:
#content select[type=text] { width: 100px }
e não se esqueça que as entradas de senha são diferentes do que entradas de texto!