Skip to main content

Command Palette

Search for a command to run...

Day 2 - Footers and Font Awesome

Road to Becoming a Front End Web Developer

Updated
2 min read
C

Adventure Curiosity Student

I usually run my errands on Saturday so I didn’t have much time to code today. I accomplish a hr in the morning and another 4 hrs in the night still trying to maintain a 3hr minimum each day. I also believe as a programmer it is important to take a day or two to step away from your keyboard to avoid burnout.

Picking up where I left off last night with yesterday’s project. I added a few p tags and with some good ol flex box techniques I was able to create a section where a client would be able to add a few descriptions of their services.

Moving on I attempted my first footer. I had a few issues dealing with font awesome icons where the icons displayed as a square and not the icon I wanted. After a hr of googling and a couple of trial and error moments I was able to identify the font family I was using came in conflict with the icon. I did a few changes with solutions I found from stack overflow and now I’ll probably be using font awesome icons where ever I can!

My next issue taught me a valuable lesson. Never underestimate the power of google developer tools! The issue I was having was with the two social media icons to the right where the icons, due to a smaller size than the two on the left they were producing an oval border in response to my general styling. I was having issues grabbing each icon individually to correct in css so I had another moment of trial and error when eventually I was able to grab hold of the two right icons, added 1px of padding left and right and they are now pretty much identical. The way I was able to understand how to get into those icons was using google dev tools. I was able to better visualize each box in my footer and how they were interacting with each other. I think this moment started a long time companionship with google dev tools.

Image 6-6-21 at 03.08.JPG

I still have a bit more I want to do to the header and I’ll probably finish it up sometime tomorrow. I did want to deep dive into media queries today and make the site more responsive but since my time was chopped up and not guaranteed I wanted to save it for tomorrow where I’d be able to dedicate 5+ consecutive hours to learning.

Here is an image of what I got going so far:

Image 6-6-21 at 03.04.JPG

Road to Becoming a Front End Developer

Part 25 of 27

Read about my journey and day to day experiences on my road to becoming a Front End Developer!

Up next

Day 1 - CSS Grid Practice

Road to Becoming a Front End Web Developer