Build a Cat Blog Page - Step 16

HTML-CSS
1

Tell us what’s happening:

Please help I’ve gone though this so many times I don’t see my mistake?

Your code so far

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Mr. Whiskers' Blog</title>
    <meta charset="UTF-8" />
  </head>
  <body>
    <header>
      <h1>Welcome to Mr. Whiskers' Blog Page!</h1>
      <figure>
        <img
          src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/1.jpg"
          alt="a cat peacefully sleeping"
        />
        <figcaption>Mr. Whiskers Sleeping</figcaption>
      </figure>
      <nav>
        <ul>
          <li><a href="#about">About</a></li>
          <li><a href="#posts">Posts</a></li>
          <li><a href="#contact">Contact</a></li>
        </ul>
      </nav>
    </header>
    <main>
      <section id="about">
        <h2>About</h2>
        <p>
          Hi there! I'm Jane Doe, a passionate writer who finds endless inspiration in the antics of my beloved cat, Mr. Whiskers.
        </p>
        <p>
          His playful nature and boundless energy keeps me on my toes. I love him so much.
        </p>
      </section>
      <section id="posts">
        <h2>Posts</h2>

        <article>
          <h3>Mr. Whiskers' First Day Home</h3>
          <p>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
            quod, voluptates, quae, quos quibusdam dolorum quia nemo repudiandae
            quidem voluptatum quas. Quisquam quod, voluptates, quae, quos
            quibusdam dolorum quia nemo repudiandae quidem voluptatum quas.
          </p>
          <p>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
            quod, voluptates, quae, quos quibusdam dolorum quia nemo repudiandae
            quidem voluptatum quas. Quisquam quod, voluptates, quae, quos
            quibusdam dolorum quia nemo repudiandae quidem voluptatum quas.
          </p>


<!-- User Editable Region -->

<section id="posts">
  <article>
  <h3>Mr. Whiskers' First Bath</h3>
    <p>
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
  quod, voluptates, quae, quos quibusdam dolorum quia nemo repudiandae
  quidem voluptatum quas. Quisquam quod, voluptates, quae, quos
  quibusdam dolorum quia nemo repudiandae quidem voluptatum quas.
    <br><br>
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
  quod, voluptates, quae, quos quibusdam dolorum quia nemo repudiandae
  quidem voluptatum quas. Quisquam quod, voluptates, quae, quos
  quibusdam dolorum quia nemo repudiandae quidem voluptatum quas.
    </p>
  </article> 
</section>

<!-- User Editable Region -->

Your browser information:

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

Challenge Information:

Build a Cat Blog Page - Step 16

2

Hi,
You already have a section with id of posts so no need to add another one. Instead the step wants you to add a new article element within the section element. Also by two paragraphs, it means two p elements so try that and don’t use the br tags. Make sure your p elements have the right text too.
Good luck!

3

Sorry about the
I was playing around trying to figure it out when I submit this it still doesn’t work am i still missing something?
Sorry for my stupidity XD

<section>
  <article>
  <h3>Mr. Whiskers' First Bath</h3>
    <p>
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
  quod, voluptates, quae, quos quibusdam dolorum quia nemo repudiandae
  quidem voluptatum quas. Quisquam quod, voluptates, quae, quos
  quibusdam dolorum quia nemo repudiandae quidem voluptatum quas.
  </p>
    <p>
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
  quod, voluptates, quae, quos quibusdam dolorum quia nemo repudiandae
  quidem voluptatum quas. Quisquam quod, voluptates, quae, quos
  quibusdam dolorum quia nemo repudiandae quidem voluptatum quas.
    </p>
  </article> 
</section>
4

can you share your updated code?

6

html
html784×414 66.6 KB

7

No worries. Please don’t post screenshots
Here’s how to post your code in the forum:
When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like
8

you don’t need another section. Append that article after the first article

1 Like
9

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like