Измените ширину всех выбранных элементов, которые являются потомками div id=“content”

Question

Я пытаюсь придать стилю все <select> элементы , являющиеся потомками <div>.Я мог бы поставить им класс, но я пытался быть умным :-)

Я считаю, что это не работает в ie6, но работает ли это в ie7 и т.д.?

Как ты это делаешь

Вот один из моих вариантов выбора (у него нет класса или идентификатора), но все они являются потомками div, идентификатор которого - "content"

<div id="content">
    <select >
        <option></option>
    </select>
</div>

Есть какие-нибудь идеи?

Answer 1

Если вам нужен какой-либо select, являющийся потомком элемента с id="content",:

#content select { ... }

Если вам нужен какой-либо select, являющийся прямым потомком элемента с id="content",:

#content > select { ... }

Если вы хотите ограничить его только элементами div с id="content",:

div#content select { ... }

Второй может не работать в некоторых старых браузерах, но остальные должны работать даже в древнем браузере, если в нем вообще есть поддержка css, например Netscape 4.

Answer 2

Это должно работать в разных браузерах:

#content select {
   // Styles for selects inside the div with id `content'
}

Answer 3

.myDiv select {
  font-family:verdana;
}

<div class="myDiv">
  <p><select>...</select></p>
  <p><select>...</select></p>
</div>

Answer 4

div#content > select {
}

Answer 5

.content select {

              css here

}

Я верю, что именно так вы можете этого добиться.Где "content" - это класс вашего div.Это отформатирует все выбранные элементы внутри div, который имеет класс "content".

Желаю удачи!

Answer 6

Решение Ника получает только прямых потомков, поэтому оно не получит select в форме в div.Это позволит получить их независимо от того, сколько в них других элементов:

#content select { width: 100px }

Если вы хотите получить, например, только ввод текста, вы можете сделать это:

#content select[type=text] { width: 100px }

и не забывайте, что ввод пароля отличается от ввода текста!