Learn Responsive Web Design by Building a Piano - Step 6

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
It’s obvious that this exercise has an issue, as several others have had the same issue, and my code below is identical to your posted code. How do I get past this issue?
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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.0.0 Safari/537.36 Edg/117.0.2045.47

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

Link to the challenge:

2

when typing in your classes. They only need to be separated by a space. you don’t need 2 class attributes.
here is an example:
<div class="class1 class2"></div

2 Likes
3

Thank you for the info. I thought I saw a key posted at some point that showed exactly what I coded, but I was obviously incorrect. Again, thank you.

1 Like