Create a Horizontal Line Using the hr Element?

Tell us what’s happening:

I am on the Applied Visual Design: Create a Horizontal Line Using the hr Element and my code is not running but i am sure i wrote the correct code.Please help me as i can not figure out what is wrong with my horizontal line


?.Thanks.

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><s>Google</s>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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

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

1 Like

Your code is correct but there is a bug with this exercise.

Go head and skip this challenge and come back later.

I faced the same problem, and skipped it,

same here, is a bug in this topic.

Will the bug go out when you come back?

The bug will go out when the DEVs at FCC fix this which we don’t know when.

Bug still going on, skipped for now.

Check out this, I have already written on that.

1 Like

just switch p and em then put hr the code will be fine :wink:

now the code will be

“<em <p Google was founded by Larry Page and Sergey Brin while they were Ph.D. students at Stanford University. </p </em”

i didn’t put > on html tags for the purpose of demonstration, you have to put them in order to work

i hope it will help. this solution work fine for me

2 Likes

Me too, Still skip for now.

Switching the p and em elements around will get you past the test here, but it’s actually invalid HTML. You should never put a p element inside of an em element in real code.

(Really hoping that the course introduces outside HTML and CSS syntax checkers at some point…)

i just tried the code and it worked. but why?

That’s just a little hack to get it to work. Pay no attention to it as it is not valid HTML
@Wilker

1 Like