Build a Book Inventory App - Build a Book Inventory App

HTML-CSS
1

Tell us what’s happening:

Hello all,

I’m working on the Book Inventory lab and am struggling to see where I’m going wrong to pass tests 48 and 49:

“have an attribute selector to target the first two descendants of span elements that have the word two as a part of their class value”

“use an attribute selector to target the first two descendants of span elements that have the word two as a part of their class value and set their background-image property to use a linear-gradient”

thanks in advance for any help!

Your code so far

<!-- file: index.html -->
 <tr class="read">
        <td>Deep Work</td>
        <td>Cal Newport</td>
        <td>Self-Help</td>
        <td><span class="status">Read</span></td>
        <td>
          <span class="rate two">
            <span></span>
            <span></span>
            <span></span>
          </span>
        </td>
      </tr>

/* file: styles.css */
span[class~="one"] span:first-child {
  background-image: linear-gradient(to bottom, green, white);
}

span[class~="two"] span:not(:last-child) {
  background-image: linear-gradient(to bottom, green, white);
}

span[class~="three"] span {
  background-image: linear-gradient(to bottom, green, white);
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36

Challenge Information:

Build a Book Inventory App - Build a Book Inventory App

2

I don’t think this is one of the ways that were accounted for. There are many way to select the span elements, this one did not come to mind when writing the tests.

Can you think of a different way to selecto those two span elements?

3

Oh, thank you!

I just wanted to know if I was getting it “wrong” in a way that I was not understanding. But if it just happens to be one of the many ways to solve it, then that helps alleviate some self-doubt. I will continue trying to play around with other options. Thanks again.