100 Days of Code Challenge-Day 9

Subscribe to my newsletter and never miss my upcoming articles

Today I'm trying to make up for missing a day yesterday so I thought I would try and do four courses on freecodecamp.org. It's a bit late and I'm tired from my personal training session, so I'm hoping it will go well but if it doesn't it just means I need to go to bed.

The first course of the day is Applied Visual Design: Set the font-size for Multiple Heading Elements. In this exercise, I have to change the font size of six heading elements.

At first, I wanted to go ahead and do

but then I thought about it a little bit more and remembered that I am doing CSS here and that isn't how you style an element. I went to the style section and entered:

h1 { font-size: 68px; }

I continued to do this for all six heading elements and it turned into this:

image.png

I passed the challenge and moved onto my second course of the day: Applied Visual Design: Set the font-weight for Multiple Heading Elements. This challenge was basically the same as the above, but with font-weight instead of font-size. I did the same thing as before but I made a mistake. I added px after the font-weight numbers and then realized my mistake after I ran my first test. I removed the px's and then I passed the challenge.

The next challenge was Applied Visual Design: Set the font-size of Paragraph Text. In this challenge, I had to change the font size of the paragraph element. As the styling for the p element was already done, I simply had to change the number of the font-size and this challenge was completed.

Last,but not least, was the Applied Visual Design: Set the line-height of Paragraphs challenge. This one was also pretty quick, though I had to add line-height to the styling I already completed in the last challenge.

Difficulty: 1 Time spent: 1 hr Takeaways:

  • CSS is coming pretty easily to me as most of what I've learned so far is basically what I did today.I feel like it will get trickier as I go along because I still haven't learned how to create shapes and whatnot. I don't see how I can make CSS art out of what I've already learned.
  • I need to learn when to use an id vs a class vs a variable vs HTML when it comes to styling. I still haven't figured out the difference between all of these and so far free code camp hasn't really explained it much. Is there a cheat sheet somewhere that may help me?

What did you learn today? Are you enjoying this content or would you rather read something else?Let me know in the comments below.

No Comments Yet