It's time to bring this series to a close. It's been a fun ride!

There are some difference between what we covered and what is actually on As is usually the case, some stuff ended up nicer the first time I did it, and some stuff ended up nicer the second time. I'll try to put the "best of both worlds" version here for download.

We do a little bit of wrap up stuff like:

  • Talk about favicon creation briefly (more)
  • Adjusting the font-size up and down at out different breakpoints (yay ems!)
  • The "monospace" and shadowed version of the header on the live site

Until next time folks!


  1. Marcus Burnette
    Permalink to comment#

    Great series, Chris!

    As a suggestion for a new series, I’d love to see a “workshop”, start to finish, setting up a development workflow for a team environment – working locally, committing using Git, and deploying live. While you’ve used the theme and templates to set up lots of blog/event/etc listings, my team makes a lot of changes to the database during development (creating views and content types in Drupal) and I’m just not sure how I could work locally without overwriting their database changes.

    I feel like I’m right on the edge of wrapping my mind around it, but haven’t had that “ah-ha” moment yet where it all makes sense.

    Thanks for a great series and I look forward to the next one!

    • Shawn McCarthy
      Permalink to comment#

      I +1 this idea for the next series :) I, too, am on the cusp of wrapping my head around git, local dev and deploy.

  2. Sailesh Vaghela
    Permalink to comment#

    What would’ve been awesome is if you had shown how you resolved the issues of the slider not showing on older versions of iOS.

    Otherwise – an amazing series, learnt so much and currently applying stuff I’ve seen on my own projects.

    • Chris Coyier
      Permalink to comment#

      To be perfectly honest, it’s not quite resolved even now =(.

      I have yet to get my hands on a real old iOS device though to test. I’d hate to fix something just for a simulator, you know? The simulator for those old iOS devices looks weird and unfamiliar on BrowserStack so I’m not sure I 100% trust it.

      If anyone can confirm it’s busted on a default iPhone 4 that would be useful. And free brownies if you have any leads as to why.

  3. G-man!
    Permalink to comment#

    Just spend the day going through this series. Great work! Just a couple things I would like to have seen. First, how do you change the colors as the slider image changes? Love how the side nav left border acts as a gradient too. I was looking for this in the videos, but didn’t see that you addressed it at all. Maybe I missed it? Second, I too would like to see how to resolve the slider for older iPhones. It also doesn’t seem to work on my Android (2.3.7), so it’s probably not just a simulator issue. Not only that, but it would be useful to see how you troubleshoot any css issue you find. Did you resolve the padding issue with the logo? I’d be interested to see those details worked out since this is where your expertise can really help us novices :)

    • Chris Coyier
      Permalink to comment#

      how do you change the colors as the slider image changes? Love how the side nav left border acts as a gradient too. I was looking for this in the videos, but didn’t see that you addressed it at all.

      #037 – Color Manipulation

      I too would like to see how to resolve the slider for older iPhones. It also doesn’t seem to work on my Android (2.3.7)

      I’m still trying to figure it out. Debugging tools on emulators are pretty much non-existant. I tried to work on it today some but didn’t get very far. It kinda seems like the JS for it doesn’t run. But I did test the RoyalSlider site on a super old Android device and it’s kinda buggy (slides don’t line up right) but it does work, so there is hope.

  4. Eduard
    Permalink to comment#

    Great series, Chris! Thank you so much. After Css-Tricks v.10 series, I’ve become a huge fan of the lodge area and every time I work on a new project I find my self digging trough those series and 90% of the time i find my answers.

    Thank you so much for your time, and I hope to see more series in the near feature.

    Cheers from Romania.

  5. Ricky55

    Just wanted to echo what the others have said, great series, answered so many questions that I had regarding a project I’m just working on.

    I wasn’t looking forward to creating custom post types in code these plugins are excellent.

    Regarding a future course just another real world site would do me just covering other types of site that you can create with WP.

    I work on my own so git doesn’t interest me at all. Watched your free screencast and it seems a bit of a nightmare. I’ve always worked locally but just deploy via FTP and keep back ups of old files.


  6. Michael Russell
    Permalink to comment#

    Great series Chris really enjoyed it and learned a lot. I’m new-ish to editing/designing themes in WordPress and was really interested in the custom post type section you did for events. When you create custom post types and you want to sort them by categories is that the part where you were talking about taxonomies? I tried it on a test site but it didn’t really work the way I expected it!

  7. Brandon Reid
    Permalink to comment#

    Extremely awesome series, Chris!

    Love your style of breaking things down in plain English. This learning experience has upped my game tremendously! Many thanks!

  8. Jeff Stone

    You da man, man! I love the lodge and I loved this series. A suggestion for a new series would be WordPress Plugins.

  9. vee_k

    Oh ,my!

    If anything I’d love to be is as confident and productive as you are, Chris !
    Just jump into coding and record and talk at the same time including little hick-ups – which really help as well at learning not to panic when they happen IRL , and you produce so many thing at once – HOW do you do that ? Do you ever sleep?
    Thank you so much for this series, it’s peppered with so much knowledge in every minute of a video … I started watching like “OK this is going this way, and at the first curve i went – whoa, what was that little detail? – it helps save time , solve this problem,other problem – really – you are such a great teacher! I’m happy being The Lodge member! Helps me not to get sweaty palms while coding ;)

Leave a Comment

Posting Code

We highly encourage you to post problematic HTML/CSS/JavaScript over on CodePen and include the link in your post. It's much easier to see, understand, and help with when you do that.

Markdown is supported, so you can write inline code like `<div>this</div>` or multiline blocks of code in triple backtick fences like this:

  function example() {
    element.innerHTML = "<div>code</div>";

We have a pretty good* newsletter.