How to Build a Responsive Website From Start to Finish - Coding the Header and Footer - part 4

Today we get into the meat of coding out the site. We code out the header and footer of the project. It's fun!

---

A big thank you to these creators for contributing sample projects for the "work" section:

---

DevTips is a YouTube show about web design and development.

HTML5 Basics Playlist:

CSS Basics Playlist:

----

DevTips now has a twitter account:

Travis also tweets:

[hyunsoochoi]

Travis, did you know that your tutorials are so much better than some of the PAID tutorials out there? You are amazing. Thank you so much for this. Subscribed.

[BosEriko]

I've been watching you for a week now and... I've learned a lot. I'm not even a beginner but I'm learning a lot. The applications you use to help you build websites are awesome. Very... very very handy.

[nacoxify]

You cannot be without liking this video after the intro! :D

[bluebitstudios_]

i just wanted to say i went to every video JUST to see your intros. Laughter before coding is a must!

[wolfteamUpdates]

Clearfix is not the lazy way :P . They both are used in different conditions. The proper explanation is that CLEAR:BOTH is used to make an element appear below any floated elements that are above it (like in above video) and CLEARFIX is designed to make an element expand to enclose any floated elements within it.

[timmderrickson]

As a complete beginner, this is the best video I have seen to date!

[AliKhan-bosd]

it is bit of hard for newbies like me but iam commited to learn it. great vid

[BneiAnusim]

In your tuts there are things I already know but I always learn new stuff. Thanks Travis for your passion. Your really love doing these!

[Benny_Shoga]

For those using the devtips starter kit and having problems with the background: pink step... 

1. Make sure your jekyll version is 2.0.3 (verify with 'jekyll -v' ; If you need to     downgrade first 'gem uninstall jekyll' then gem install jekyll -v '2.0.3')

[KatrinaaH]

Found your episode on using Jekyll and here I am... can't stop watching the series!!! Has me pondering the possibilities of Jekyll, learning sass and using bourbon!
Thanks for sharing what you know!!! 

[OfficialDevTips]

Hannes Lp I use the "stylus sugar for espresso" to do my syntax highlighting

[samfurlong]

man i seriously learn alot just from watching your workflow, let alone all the awesome content you give. really loving this series, cheers!

[TheCooocy]

It's good to see you making mistakes and then fixing them! I haven't seen this in other tutorials and I discovered just right now the 'Inspect Element' tool. Great!

[kindasport]

1: Thank you for all those tutorials!
2: About GoogleFonts: How do you get the "google-font-code" from _fonts.scss? I searched on GoogleFonts but was not able to find it..
3: Did you renamed the "3-sections" folder into "modules" for the Starter-Kit? There's no such folder..

[chipio]

This is absolutely the most satisfying tutorial I've ever seen.

[alixqureshi]

If anyone struggles with changing the bg colour to pink even though they've tried every other solution, try changing your port number in the config.yml file, mine was clashing with another installation, somehow this ended up working for me!

[kamilamilon]

I have tried many tutorials, but yours are the best. Many thanks!

[RahulSiyanwal]

Sorry Travis, but I am totally confused and frustrated by now. Starter Kit is very different from the one you are using in this tutorial. And nothing is working the way it should have been.

[SireAltynneSarris]

Amazing. I was a bit lost at first because we are using different programs, but I quickly caught up. Though I did not get through the whole video, I learned a ton. Thank you.

[Waqashmed]

People forked around with the 1st project files of yours on GitHub. I downloaded and nothing shows up. Please check those files if you can. Thanks Travis