Create a Horizontal Line Using the hr Element NOT WORKING

HTML-CSS
1

Tell us what’s happening:
I tried in every way but it doesn’t seem to work. I have even tried to copy and paste the code of the next exercise but nothing seems to work.

Your code so far


<style>
  h4 {
    text-align: center;
    height: 25px;
    
  }
  p {
    text-align: justify;
  }
  .links {
    text-align: left;
    color: black;
  }
  .fullCard {
    width: 245px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin: 10px 5px;
    padding: 4px;
  }
  .cardContent {
    padding: 10px;
  }
  .cardText {
    margin-bottom: 30px;
  }
</style>
<div class="fullCard">
  <div class="cardContent">
    <div class="cardText">
      <h4>Alphabet</h4>
      <hr>
      <p><em>Google was founded by Larry Page and Sergey Brin while they were <u>Ph.D. students</u> at <strong>Stanford University</strong>.</em></p>
    </div>
    <div class="cardLinks">
      <a href="https://en.wikipedia.org/wiki/Larry_Page" target="_blank" class="links">Larry Page</a><br><br>
      <a href="https://en.wikipedia.org/wiki/Sergey_Brin" target="_blank" class="links">Sergey Brin</a>
    </div>
  </div>
</div>

Your browser information:

User Agent is: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:61.0) Gecko/20100101 Firefox/61.0.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/

2

Hi,

I think test of this question does not work correctly, when you add <hr/> between h2 and p tag it return

The hr tag should come between the title and the paragraph.
3

What you have done is correct, there is a bug in this test, you can skip it, and a possible hack solution is <p><em> to <em><p>, but this is not the solution intended

2 Likes
4

Cannot pass this course with this solution. yes?

5

Yea you can pass it, what i meant is that’s a hack, it is not the correct solution, adding the hr should pass but it isn’t

6

It is a Bug…

Which means that you are doing it right, there’s no problem with your code.

The question has been asked many times like this one here and the only way to pass the challenge is for some reason to wrap your <p></p> with <em></em> tags.

2 Likes
7

Thank you for your answers :slight_smile: I have also tried with the

and passed the exercise.

8

Yes this has been worked!

1 Like