Learn CSS Flexbox by Building a Photo Gallery - Step 9

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
Like it says You should have a body selector. but i have a body selector it is not going forward so pls help

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">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/1.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/2.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/3.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/4.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/5.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/6.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/7.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/8.jpg">
      <img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/9.jpg">
    </div>
  </body>
</html>

/* file: styles.css */
* {
  box-sizing: border-box;
}


/* User Editable Region */

*body{
  font-family: "sans-serif";
  background-color: #f5f6f7;
  margin: 0;
}

/* User Editable Region */


.gallery img {
  width: 100%;
  max-width: 350px;
  height: 300px;
}

Your browser information:

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

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

Link to the challenge:

2

This is not a body selector. Why have you added an asterisk? If you wish to select an HTML element, just use the name, without any prefix.

1 Like
3

sorry i dont know about it learning so what is actually a body selector

4

wait i got it thanks

5

A CSS selector is simply a means of selecting an element, id or class (for instance), so that you can write CSS rules to apply to it.

In this example, the selector is h1, the property is color and the value is red. This h1 selector will apply the colour red to all text in all h1 elements.

h1 {
  color: red;
}

If you want to select HTML elements by their name, the selector is simply the name of the element. If you wish to select classes you prefix the class name with a dot (e.g. .main-section), and if you wish to select an element by its id attribute, you prefix the id name with a hash (e.g. #description).

6

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