Learn CSS Flexbox by Building a Photo Gallery - Step 5

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Photo Gallery</title>
  <link rel="stylesheet" href="./styles.css">
</head>
<body>
  <header class="header">
    <h1>css flexbox photo gallery</h1>
   </header> 
  
  <div class="gallery"></div>
    .gallery{
    <img></img>
    <img></img>
    <img></img>
    <img></img>
    <img></img>
    <img></img>
    <img></img>
    <img></img>
    <img></img>
    }
 
</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/105.0.0.0 Safari/537.36

Challenge: Learn CSS Flexbox by Building a Photo Gallery - Step 5

Link to the challenge:

sir, what is error? Why code is not pass?

Hi, please, next time when you post your question, provide it with a specific question.
Asking a better question will help you understand your current situation.

You are on HTML page, not CSS.
The element you used is supposed to be at CSS page

Figure out how to make an element at your HTML page

Read full instruction rather than the last paragraph.
Here is the first paragraph
Below your .header element, create a new div element and assign it a class of "gallery" . This div will act as a container for the gallery images.

You placed CSS selectors inside a HTML body. .gallery{} is supposed to go inside the CSS file. This means that the nine <img> elements should be placed inside the <div>container, not the .galleryselector.

1 Like

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