CSS selector - Selecting specific tags inside a parent class

user_9956711 0
Viewed 2655

Why is it that the CSS selector is not picking only the elements inside the parent class, and its rather picking all the tags in the code. Even though it is mention took look inside ".new1 h1, p" CLASS. Is it possible to apply CSS on selected tags inside a class, or do i need to add additional classes on p, h1 tags.

.new1 h1,
p {
  color: purple;
  text-align: center;
}
<p>This is a paragraph.</p>

<section class="new1">
  <p> Hello </p>
  <h1> Hi! </h1>
</section>

<section class="new2">
  <p> Hello </p>
  <h1> Hi! </h1>
</section>

css-selectors css html
1 Answers
  1. you should use > for that
  2. > will be used when you want a property value to be applied to specific element not for all element.

.new1>h1,
.new1>p {
  color: purple;
  text-align: center;
}
<p>This is a paragraph.</p>

<section class="new1">
  <p> Helloooo </p>
  <h1> Hiiii! </h1>
</section>

<section class="new2">
  <p> Hello </p>
  <h1> Hi! </h1>
</section>

user_35643590
Related