Applied Visual Design: Adjust the Height of an Element Using the height Property

HTML-CSS
1

I am very confused here on why this part is not working:

Your code so far

<br> 

<style>
  h4 {
    text-align: center;
    height: 25px;
  }

  p {
    text-align: justify;
  }
  .links {
    margin-right: 20px;
    text-align: left;
  }

  .fullCard {
    width: 245px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin: 10px 5px;
    padding: 4px;
  }

  .cardContent {
    padding: 10px;
  
}

</br>
</style>
<div class="fullCard">
  <div class="cardContent">
    <div class="cardText">
      <h4>Google</h4>
      <p>Google was founded by Larry Page and Sergey Brin while they were Ph.D. students at Stanford University.</p>
    </div>
    <div class="cardLinks">
      <a href="https://en.wikipedia.org/wiki/Larry_Page" target="_blank" class="links">Larry Page</a>
      <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/67.0.3396.79 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property

2

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

markdown_Forums

3

Sorry, I don’t think it’s working at all?

4

Hello there, mcne65! I just ran your code on my end and it seems to be working fine for me. Once you’ve written your code, you can comment it out temporarily by putting two slashes (//) in front of it to disable the code, then remove the slashes to enable your code to see how your code changes the content in the preview window. One thing I did notice is your use of the line break tag (<br>) in your code. There are two issues with this. If you’re going to use the line break tag, it should be used in the body of your HTML as it is used to change the layout of your site that people see. You have used the line break tag around your styling, so it’s not accomplishing anything for you. Also, the line break tag is self-closing. This means that you don’t need a </br> tag like you’d use for <p> or <h1> tags. I hope this helps. If I can clarify anything, please let me know!

5

I’m having the same exact problem now. I see it change the h4 size in the picture, but it will not tell me it’s correct and let me pass.

6

I just passed it. Make sure your browser is at 100%, that you’re not zoomed in or zoomed out. I think this affects the pixel measurements for the tests.

1 Like
7

Don’t quite get it. Please elaborate more to me.

8

Ah got the idea now, thank you so much for the handy tip. A bit dodgy if I must say

9

worked like a charm!