How do I set CSS to multiple Header Tags? h1, h2...

[simonmlewis]

Code: Select all

.grve-container h1
{
margin-bottom: 0px;
}

.grve-container h2
{
margin-bottom: 0px;
}

I'd like to set this margin to the h1, h2 and h3 when they are within the grve-container DIV.

I tried these options but to no avail.

Code: Select all

.grve-container h1, h2, h3
{
margin-bottom: 0px;
}

Code: Select all

.grve-container h1 h2 h3
{
margin-bottom: 0px;
}

I'm sure there is a way, but I cannot see how you do it.

[Celauran]

You've got the right idea

Code: Select all

.grve-container h1,
.grve-container h2,
.grve-container h3
{
  margin-bottom: 0px;
}
 

[simonmlewis]

Oh like that! I thought it was separated by the 'inner' element, rather than having to do it with the surrounding one each time. Still less code though. Thanks.
Also, and it is on this very similar subject, what is the difference between:

Code: Select all

.myclass.mychildclass
{
color: #000000
}

...and ....

Code: Select all

.myclass .mychildclass
{
color: #000000
}

I've seen both.

[Celauran]

Oh like that! I thought it was separated by the 'inner' element, rather than having to do it with the surrounding one each time.

SCSS and SASS do it that way. That might be what you were thinking of.

Also, and it is on this very similar subject, what is the difference between:

Code: Select all

.myclass.mychildclass
{
color: #000000
}

...and ....

Code: Select all

.myclass .mychildclass
{
color: #000000
}

I've seen both.

When there's no space, it denotes an element having both classes. When there is a space, it's an element with the child class inside an element with the parent class.

Code: Select all

<div class="myclass mychildclass">This is the first example</div>

<div class="myclass">
  <div class="mychildclass">
    This is the second example
  </div>
</div>

[simonmlewis]

I see. thanks. So the top one would be: .myclass.mychildclass

[Celauran]

Yes

Example