Learn HTML by Building a Cat Photo App - Step 14

HTML-CSS
1

Tell us what’s happening:

I’m on step 14, and I keep getting it wrong. I don’t know why.

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Everyone loves <a href="cute cats online!</p>

<!-- User Editable Region -->

      <p> Everyone loves <a href="https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg"> cute cats </a> online.</p>


<!-- User Editable Region -->

      <p>See more <a href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
      <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
    </main>
  </body>
</html>

Your browser information:

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

Challenge Information:

Learn HTML by Building a Cat Photo App - Step 14

2

Spacing matters in these sorts of things.

3

Welcome to the forum @taretiemo4

Please remove the following code from the editor:

It is an extra paragraph element, which the instruction did not ask you to insert.

Also, I noticed you replaced the exclamation mark at the end of the sentence with a period.

Happy coding

4

it worked. Thank you!

1 Like
5

Tell us what’s happening:

i dont know what the information i ssaying i shuld do i keep trying but im abit confused.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
    <style>
      h1, h2, p {
        text-align: center;
      }
    </style>
  </head>
  <body>
    <main>
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
      <section>
        <h2>Coffee</h2>
      </section>
    </main>
  </body>
</html>

/* file: styles.css */

/* User Editable Region */

<style> styles.css</styles>

/* 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/131.0.0.0 Safari/537.36

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 14

6

Hi there! You didn’t need to add style tags and the text styles.css.
You need to write that styles you previously written between the html style tags

7

Tell us what’s happening:

I’m not still getting it. i dont know what im doing wrong.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
    <style>
      h1, h2, p {
        text-align: center;
      }
    </style>
  </head>
  <body>
    <main>
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
      <section>
        <h2>Coffee</h2>
      </section>
    </main>
  </body>
</html>

/* file: styles.css */

/* User Editable Region */

<style> 
h1 {
  text-align: center;
}
h2 {
  text-align: center;
}
p {
  text-align: center;
}
</styles>

/* 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/131.0.0.0 Safari/537.36

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 14

8

Hi @taretiemo4

Make sure to exclude the opening and closing style tags.

Also, you need to recreate the css from the html file.
You can copy and paste the code if you want.

Happy cdoing

9

Tell us what’s happening:

I have tried this, and its not working. I am still confused about what I’m supposed to do. I’m supposed to copy SOMETHING. I don’t know where I’m supposed to copy it from.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
    <style>
      h1, h2, p {
        text-align: center;
      }
    </style>
  </head>
  <body>
    <main>
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
      <section>
        <h2>Coffee</h2>
      </section>
    </main>
  </body>
</html>

/* file: styles.css */

/* User Editable Region */

<html>
h1 {
  text-align: center;
}
h2 {
  text-align: center;
}
p {
  text-align: center;
}
</html>

/* 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/131.0.0.0 Safari/537.36

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 14

10

Hi @taretiemo4

For this step, you can copy the code between the style tags in the html file and paste it into the css file.

Happy coding

11

hi @taretiemo4 , I have merged your 4 topics for step 14. Please do not open multiple topics for the same step. If you need more help then respond back to the original topic you created with your follow up questions and/or your updated code and question.
Thank you.

12

Hi there!

Remove that html opening and closing tags from css file.