CODEWITHSUNDEEP
htmlcsscss-selectors
Naveen Gamage
Naveen Gamage

Reputation: 1884

Multiple tags within a class

How do I apply css styles to HTML tags within a class at once instead of repeating the class name each time.

.container h1,.container p,.container a,.container ol,.container ul,.container li,
.container fieldset,.container form,.container label,.container legend,
.container table {
  some css rules here
}

how do I reduce repetition of the class name?

Upvotes: 1

Views: 202

Answers (2)

Mr. Alien
Mr. Alien

Reputation: 157304

You cannot reduce the current selector of yours as far as pure CSS goes.

You might want to take a look at LESS or SASS for doing that.

Also, I just read your selector, seems like you are covering almost every tag, so if you are looking to target few properties to each tag, the best you can do with CSS is to use a * selector (Universal selector) which will match any type of element nested under an element having a class of .container

.container * {
   /* Styles goes here */
}

Apart from the above, some properties are inherited by few child elements from their parent such as font-size, color, font-family etc.

So you don't need to write those for each, because I saw you using .container ul, .container li which didn't make much sense to me.

Upvotes: 3

robbclarke
robbclarke

Reputation: 749

Use LESS. It would come out looking like this.

.container {
    h1, p, a, ol, ul, li, fieldset, form, label, legend, table {
        your styles here
    }
}

Otherwise, you're SOL. Sorry.

Upvotes: 2

Related Questions