marklyck / tiy-day02

Responsive website

#Day-02

My attempt to recreate this image, only using CSS and the supplied html.

Here is my version in html and CSS:

I completed both adventurer mode and Epic Mode:

###Adventurer Mode

Follow the pattern in index.html and add 3 more Octocats to your web page. Use the Octodex at http://octodex.github.com to get more images. Make sure the styles remain consistent and neat, even with a new line of Octocats added to the page.

###Epic Mode

Try making your web page responsive when the browser is resized.

---

My project uses float instead of inline-block, to make sure there won't ever be an odd "octocat" in the middle. They will always float left, while the entire thing is still centered in the screen.

The "octocats" will also shrink to fit any screensize.

My project can be seen live at: http://mlyck-day02.surge.sh

---

Looking back at this project late on the same day, I already learned several ways I could have improved on this code. If I were to redo it, I would definitely be using the newer FlexBox to position my elements better.