Learn Responsive Web Design by Building a Piano - Step 6

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
Not sure where I am going wrong, I have added the second keys
Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Piano</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  </head>
  <body>

<!-- User Editable Region -->

    <div id="piano">
      <div class="keys">
        <div class="key"></div>
        <div class="key" class="black--key"></div>
        <div class="key" class="black--key"></div>
        <div class="key"></div>
        <div class="key" class="black--key"></div>
        <div class="key" class="black--key"></div>
        <div class="key" class="black--key"></div>
      </div>
    </div>

<!-- User Editable Region -->

  </body>
</html>

/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.5.1 Safari/605.1.15

Challenge: Learn Responsive Web Design by Building a Piano - Step 6

Link to the challenge:

2

This isn’t how you add multiple class names to an element. The element is only allowed to have one class attribute but that attribute can have several values separated by spaces. You did this several times in the Balance Sheet course, so you can look back at that if you need an example.

3

Hi bbsmooth, thank you yes I figured that one out

1 Like
4

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