Treehouse: Grow your CSS skills. Land your dream job.

Transforms on SVG Elements

The following is a guest post by Ana Tudor. Ana always does a great job digging into the math behind what we can do graphically on the web. In this case, that's extra-useful as there are several ways to handle SVG transforms and they require a bit of mathematical thinking, especially converting one type to another for the best cross browser support. Here's Ana.

Just like HTML elements, SVG elements can be manipulated using transform functions. However, a lot …

Read Article →

A Complete Guide to SVG Fallbacks

The following is a guest post by Amelia Bellamy-Royds and me. Amelia and I recently presented at the same conference together. We both covered SVG, yet neither of us SVG fallbacks comprehensively. It's such a huge topic, after all. While I've covered SVG fallbacks before, it's been a few years and we figured we could do that subject better justice now. Here we go!

Read Article →

Icon and Text Alignment 

Jonathan Snook on a frustrating CSS situation I know I deal with regularly, getting an image/icon to line up nicely with a name/word. This was exactly the impetus behind this tweet. I feel validated to know that his solution is the same as mine normally is: relative positioning and nudge it with relative units until it looks right.

Ignoring `the` in WordPress Queries

The following is a post by Jason Witt. Here Jason shares a method for doing something you might assume is pretty easy, but turns out to be a little bit more complicated than you might like. Fortunately with Jason's code and examples, it can be easy.

Read Article →

Sponsor: SiteBuilder 

I bet you can guess what SiteBuilder.com does. It helps you build, manage, and host a website completely with their online tool. I'm a big fan of giving people the power to do this on their own without having to learn to be a web developer themselves. There is a certain type of client that SiteBuilder is absolutely perfect for. One of the CSS-Tricks staffers even said their (quite young) kid uses it for their site, a testament to its ease-of-use.

For a limited time, SiteBuilder is offering a 20% discount on all website plans. Jam-packed with some awesome features, SiteBuilder also offers a 100% free custom domain of your choice with every single plan. With SiteBuilder, you can build a professional website for as little as $7.95.

The Priority+ Navigation Pattern

The idea is: show as many navigation items as will fit horizontally with a UI toggle to show the rest. I like the idea. Why hide everything behind a toggle if there is room to expose the most important links? How it looks and how it is implemented could vary. Let's look at some examples!…

Read Article →

Cyclomatic Complexity: Logic in CSS 

Harry Roberts on thinking about CSS selectors as a long series of nested logic. Sometimes it's hard for people to wrap their heads around why long, overly specific CSS selectors are problematic. When you see it as a crazy nested block of IF (SPECIFIC_CONDITION) { } blocks, it might make that more clear to some folks.

The Deal with WordPress Transients

The following is a guest post by Scott Fennell. In this article Scott is going to dig into an important type of caching that is available to you in WordPress: transients. Like any cache, you use transients to store any kind of data that takes a long time to get, so the next time you need it, it returns super fast. The beauty of transients is they clean up after themselves, as long as you watch out for the

Read Article →

#139: Explaining the Server Side Mustard Cut

I published a written post about this idea of the Server Side Mustard Cut. So if you're into reading and checking out code samples and stuff, that's the place for you. In this video I just walk through all that, explaining myself as we go.

I'll give the same caveat I have everywhere else I've introduced this: this may not be perfect for every site out there. In fact I think normal RWD stuff is generally better, up to …

Watch Video →

More Blog Posts →