Learn More About CSS Pseudo Selectors By Building A Balance Sheet - Step 51

Tell us what’s happening:

Your code so far

<!-- html -->
<div class="table-wrap">
          <table>
            <caption>Assets</caption>
/* CSS */
table > caption {
  color: #356eaf;
  font-size: 1.3em;
  font-weight: normal;
}

I understand that in order to complete the linked challenge I need to change the selector to “table caption” but I don’t understand why.

My code will select all caption elements where the parent is a table element. The “table caption” will select all ‘caption’ elements inside a ‘table’ element. Is this not effectively the same thing? If element ‘x’ is inside element ‘y’, aren’t they child and parent?

Basically what I’m asking is: what’s the difference between parent-child elements and just being inside another element?

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/112.0.0.0 Safari/537.36

Challenge: Learn More About CSS Pseudo Selectors By Building A Balance Sheet - Step 51

Link to the challenge:
https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/step-51`

Welcome to our community!

Please repost the link to the challenge. This link is not working properly. Also, use the </> button to format the code.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.