CODEWITHSUNDEEP
css
user1184100
user1184100

Reputation: 6894

Multiple html div's using same css style

I have 2 div elements #container1 , #container2. Can i use styling in below manner ?

#container1,#container2 h5{ 
}

If yes then i cudn't get it to work for #container3

#container1,#container2,#container3 h5{ 
}

rule somehow doesn't seem to apply for #container3 .. What could be the reason ?

Upvotes: 3

Views: 29485

Answers (3)

Saeed-rz
Saeed-rz

Reputation: 1443

your code seems to correct but you can use another solution... why you doesnt use calss for every div you want?

.divcontainer{
css....
}

Upvotes: 0

rjz
rjz

Reputation: 16510

That selector will apply to #container1,#container2, and any h5s in #container3. I think you want:

#container1 h5, 
#container2 h5, 
#container3 h5 {
  /* styling */
}

This is exactly what classes are intended for, however. If you add class="container" to each of your container divs, you can simply use the following rule:

.container h5 {
  /* styling */
}

Upvotes: 16

francisco.preller
francisco.preller

Reputation: 6639

The h5 at the end means that particular rule only applies to h5 elements inside the id.

As an exmaple, from your first example...

#container1,#container2 h5{ 
}

The above rules would apply to an element with id=contrainer1 and also to an h5 element inside an element with id=container2.

With:

#container1,#container2,#container3 h5{ 
}

You are actually targetting id=container1, id=container2 and also the h5 element inside an element with id=container3

In both cases though, the element with the h5 tag does not target the element itself, only the heading tag inside it.

Upvotes: 1

Related Questions