Posted on by beyermusic2

How do you create a child selector in css code referring to span

The child selector simply refers to the NEW word in the word in the center-text class.
The h2 must be singled out as child.

Here's task - Add a CSS rule for all span elements that are children of h2 elements that sets the text color to #FA9F42 and its font size to 0.75em.

Thank you!

css

body{
  background-color: #E0E0E2;
}
  h1 {
    color:#721817;
    text-align: center;
  }  

  h2 {
    color:#721817;
    font-size: 0.75em;
    text-align:center;
  } 

#center-text > h2{ 
  color: #fa9f42;
  font-size: .75em;
}
  .center-text{
    text-align:center;
  }

  #logo{
    display:block;
    margin-left:auto;
    margin-right:auto; 
  }

  #copyright {
    padding-top: 12px;
   font-size: 0.75em;
  }




html


<!DOCTYPE html>
<html>
<head>
    <title>Little Lemon</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div>
        <img src="logo.png" id="logo">
    </div>
    <div class="center-text">
        <h1>Our Menu</h1>
        <h2>Falafel <span>NEW</span></h2>
        <p>Chickpea, herbs, spices.</p>
        <h2>Pasta Salad</h2>
        <p>Pasta, vegetables, mozzarella.</p>
        <h2>Fried Calamari</h2>
        <p>Squid, buttermilk.</p>
    </div>
    <div class="center-text">
        <p id="copyright">
            Copyright Little Lemon
        </p>
    </div>
</body>
</html>

I am told it is in edit screen but now I can't find that button to edit.