Stuck on the padding/margin Headline in the Build a Tribute Page Challenge

Whenever I move my headline down with the margins, the background color goes with it and leaves a white space at the top. I’ve attempted to play with margins/padding and I’ve had no luck with this.

Here’s my code so far:

#main{
font-size: 19px;
font-family: Arial, Geneva, Helvetica, sans-serif;
background-color: #ECECEC;
margin: 0;
}

#title{
text-align: center;
font-size: 40px;
margin-top: 50px;

Thank you for your help!

First, I think we’d need all of your code. Do you have a link to a pen? Some other IDE? If you are developing it locally, can you provide a repo?

Secondly, remember that you don’t have to do an exact copy of the original. I doesn’t even have to be about Dr. Norman Borlaug - you can choose any subject you want, as long as it is functionally similar.

I’ll add my own flair this time around. I didn’t realize we could do whatever subject we want. Here is my codepen to the project: https://codepen.io/andrewcraigdev/pen/zYzOLaa

There are different ways to do this. This doesn’t work?

#title{
  text-align: center;
  font-size: 40px;
  padding-top: 40px;
}

I don’t think that margin would work. Remember that (working outward) it is content, padding, border, and margin. Consider this. I believe that the background only extends out to the border, not into the margin.

And don’t get me wrong, doing an exact duplicate of a website (cloning) can be a good learning tool. It just isn’t required here. For this and the other challenges, you can get a little creative - as long as it satisfies the user stories and passes the test and (presumably) looks decent, you’re good. Since you’re still learning, I wouldn’t worry about cloning for now - you have enough to worry about.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.