Day 2: CSS

Today's topic is CSS and last night I spoke to contacted two of my classmates and we agreed to meet today to work the assignments together. I couldn't study at home because of all the distractions and studying with others who have the same interests and goals helps keep me focused. After breakfast I picked up one of them and we met the other one at a Starbucks. CSS, another topic I've been covering for years, was suppose to make the second day of the bootcamp another easy day. The lectures caught me by surprise as I was struggling to cover the differences between floats and displays, and the four types of positioning for an object. I was reading the lectures slowly while one of them was speeding past me. I was also still half-asleep and was tempted end this day early to go home and sleep. It worried me that I would fall behind.

NOTE: To preserve the privacy of the people I mention in this blog I will refer to them in the third-person. If in the event I need to mention them individually I will refer to them by their initials. 

Two hours later we took a break for lunch. We got a chance to get to know each other better. Taking some time to eat and talk did help loosen my worries. After lunch we headed over to the library and by then my brain was wide awake and I was processing the information faster than the morning. I wasn't sure if it was the food, the Red Bull I drank, or my habit of starting slow before picking up the pace but I caught up with one of the guys. When it was time to work on a two hour assignment we helped each other complete it under half an hour. He pointed out my errors and I returned the favor when I saw mistakes in his code.

After the first assignment we moved onto the next CSS topics of resets and normalizing to solve the problem of browser compatibility. I didn't understand the lecture and one of the guys explained to me that browsers have different CSS default settings and resets help create consistency between the browsers. That certainly made the next assignment easier.

For the next assignment we had to recreate a sample webpage (as shown below) using the HTML and CSS topics covered. The trick here was to avoid using floats and keep the width below 970px.

I saw the webpage as sections divided by divs. There were four main divs here: #header, #navigation, #main_content, and #footer. After aligning them properly within the width limit it was all just a matter of fleshing it out with the content. By the this I was picking up some serious momentum and my focus was no longer on sleep or the daily distractions of music or video games but on solving this puzzle.

Next thing I knew it was 6pm, we had completed the requirements for the day, and we were getting started on the next assignment. One of the guys left a couple of hours earlier and the other one offered his place to continue with tomorrow's work. We started the next assignment there, which was basically the previous assignment except with sub-divs to take care of the tiny details that are in every webpage.

This is what we had to recreate:

And this is what I had by the time we called it quits at 9pm: 

In case you are wondering what the blue rectangle is doing in a predominately red themed webpage I am using it to mark where the #text_size sub-div is located. I suppose it wouldn't have hurt to deactivate it for the night but by 9pm I was worn and wasn't seeing clearly. 

We're going to meet again tomorrow. Today started off slow with momentum building after lunch. I expect to see more of that in the following days. Like any other muscle my brain needs to be exposed to these exercises on a regular basis so by the time I make it to onsite I'm in full gear for the full-stack assignments.