Hey there, I'm trying to apply CSS to all forms within a div. For example:

<style type="text/css">
#form-fields > input {
padding:3px 3px 2px;
border:1px solid #c7c7c7;
#form-fields > input:focus {

And then I have

<div id="form-fields">
blah blah forms

Is there a way I can select all descendants?

3 answers

This was chosen as the best answer

Yes, simply:

div#formFields form input {

Note about the class/id names, I try to stay away from anything besides a good old underscore when needed:

See this snippet from the W3C documentation:

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A1 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B&W\?" or "B\26 W\3F".

Also, if you're trying to make all form elements the same style, use multiple selectors like this:

form#formFields form input, 
form#formFields form select, 
form#formFields form textarea {
    etc. etc.

and then "reset" the unwanted styles for textboxes for example:

form#formFields form textarea {
Answered over 7 years ago by Gary Hepting
flavicius 118

In this case you can just delete ">" (child selector) and it'd work.

Answered over 7 years ago by flavicius
  • Yes, flavicius is right. The ">" selector is specifying that it applies to DIRECT child elements only -- Note however, this doesn't really work with browsers that are not compliant with CSS 2.1 Gary Hepting over 7 years ago
Tae 30

Also you can use the universal selector:

#form-fields  * {}

This works even in IE6.

Answered over 7 years ago by Tae
  • That would be quite drastic, as most definitely you are not going to want your paragraphs, headings and lists to all assume these styles that are intended for form-elements... Gary Hepting over 7 years ago
  • Perhaps, but is another option. alainmeyer1 said "Is there a way I can select all descendants?", so I don't understand why the negative point. Tae over 7 years ago