Design a Blog Post Card - Design a Blog Post Card

HTML-CSS
1

Tell us what’s happening:

Step 13 is not showing complete, even though it is in the css sheet and is working properly in the preview section. Specifically it is in regards to making the .read-more:hover be a different color.

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">
    <link rel="stylesheet" href="styles.css">
    <title>Blog Post Card</title>
</head>
<body>
    <div class="blog-post-card">
        <img class="post-img" src="https://cdn.freecodecamp.org/curriculum/labs/cover-photo.jpg" alt="a postcard">
        <div class="post-content">
            <h2 class="post-title">Welcome to my blog!</h2>
            <p class="post-excerpt">This is my first post on my brand new blog</p>
            <a class="read-more" href="#readmore.html">Read More</a>
        </div>
    </div>

</body>
</html>

/* file: styles.css */
* {
  text-align: center;
}

.blog-post-card {
  background: white;
  border: 5px;
  width: 100px;
  border-radius: 5px;
  text-align: center;
}

.post-img {
  border-bottom-style: solid;
  border-bottom-color: black;
  width: 100px;
}

.post-content {
  padding: 5px;
}

.post-title {
  color: orange;
  margin: 2px;
}

.post-excerpt {
  color: orange;
  margin: 2px;
}

.read-more:hover {
  color: purple;
}

.read-more {
  color: green;
  background-color: gray;
  margin: 2px;
  padding: 2px;
  border-radius: 5px;
  display: inline-block;
  
}

Your browser information:

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

Challenge Information:

Design a Blog Post Card - Design a Blog Post Card
https://www.freecodecamp.org/learn/full-stack-developer/lab-blog-post-card/lab-blog-post-card

2

Nevermind… It says “BACKGROUND-COLOR”… doh!