Can I style an id/class with elements in the same selector?

1

If you want to apply the same style attributes to an id or class as are being applied to elements, is it possible to group them into the same selector?

Here’s my HTML:

<section id="contact">
  <div>
    <h2>Hit me up yo</h2>
    <p>I won't bite:</p>
  </div>
  <br>

  <div class="contact-link">
    <a id="profile-link" href="https://codepen.io/El_Escandalo" target="_blank">
      Codepen</a>
  </div>
</section>

So my question is, could I somehow group the class="contact-link" or id="profile-link" into the same selector as I’ve grouped elements like this?

#contact h2,p,.contact-link {
  margin: 0px;
}

or

#contact h2,p,#profile-link {
  margin: 0px;
}

I don’t think these ^^^ are working, I’m just wondering if there is a way to do it that would work? Again, I just want to apply the same style to the contact-link as I’m applying to the h2 and p elements. Thank you!

2

Yes, both your examples would work and it is usually organized for readability like so:

#contact h2,
p,
.contact-link {
  margin: 0px;
}

What that means is “every h2 inside of #contact will have no margin, every p and every .contact-link will have also no margin, doesn’t matter if they are inside #contact or not”

To apply to only elements inside #contact you just do like so:

#contact h2,
#contact p,
#contact .contact-link {
  margin: 0px;
}
1 Like