Responsive Web Design Certification Projects

I have all the tests passing for all five projects in the Responsive Web Design Projects certification. I just have a couple questions before I send them all in. For one thing, my product landing page and technical documentation page are very generic, that is to say they both just have lorem ipsum in their text fields and basically just blank links, etc. to satisfy the test requirements. I’m curious how other people on here (who I am assuming are also beginners) are so knowledgeable about coding languages that they can make their technical documentation pages all about CSS or JavaScript like I’ve seen some people do. I guess what I’m asking is, is there anything wrong with leaving these pages so generic with the lorem ipsum text?
Here’s my personal portfolio where you can find links to all my other projects.
Also, I can’t seem to get rid of some white space at the very bottom of some of my webpages. I’ve gotten rid of it on my survey and product landing pages, but just can’t seem to do it with my personal portfolio and tribute page. I assume it’s there on the technical documentation page, but the background is white anyway. I feel like I have to keep trying different things to deal with it, like on one of them I had to set the margin of the body to zero and that took care of it, on another one I had to set the margin to zero and also set the padding of the footer to say 30px, and that will work, but then on others I’ll try both of those and it’s still there.
I still want to try some styling things on most of these (font types, maybe some different colors, making text areas a different shape/color) so I hope I don’t seem too lazy.
Thanks in advance.

nothing wrong
other people have made technical documentation about mundane things, like baking something
you could also use it as a chance to learn more on a language…

nope, that will open my dashboard - try with a differnt link

1 Like

I went looking for the users account and I think I’ve found it!
Just want to make sure that this is @wkay42 's account.

https://codepen.io/wkay42

1 Like

CodePen handles the HTML portion differently. The code that you put into the editor is already in a boilerplate format. You can read more about it at this link.

I think the reason that you’re confused is because your code to CodePen looks like

<body>
  <main id="main">
    <body>
      ...
    </body>
  </main>
</body>

This is because CodePen already creates the

<html>
  <head>
  </head>
  <body>
   < !-- __This is where the html portion of your code goes__ -->
  </body>
</html>

So a simple solution to getting rid of the white space at the bottom would be changing your css rule!

body {
  padding: 0;
  margin: 0 0 0 0;
  font-family: "Courier New"
}

to

body {
  background-color: red;
  padding: 0;
  margin: 0;
  font-family: "Courier New"
}

That’ll let the red background cover the entire viewport! Also, as a fun little tid-bit, I’ve used the margin shorthand. Instead of saying:

margin: 0 0 0 0;

You can use:

margin: 0;

Read more about the margin shorthand here!
https://www.w3schools.com/cssref/pr_margin.asp

1 Like

Thanks for pointing out the error. I think what happened is I copied the link to my dashboard, (which is why CodePen treats the link as one to your dashboard) intending to use that and then decided to use the link to my portfolio but forgot to use that link. I’ve fixed it.

1 Like