The following is a guest post by Tobias Günther. Together with his team, Tobias creates Tower, a Git client for Mac. I personally use it every day. Just this week, they released version 2 of Tower, which I was a beta tester for. I'll let him explain all about Tower, why they created it, and what's new in this version.…
Read Article →
Andreas Bovens put together this epic recipe list for <picture> / <img srcset>. There are four scenarios:
- Do my image sizes change depending on my responsive design rules?
- Do I want to optimize for high-dpi screens?
- Do I want to serve images with different mime types to browsers that support them?
- Do I want to serve different art depending on certain contextual factors?
Then Andreas shares what the code would look like for all of those plus any combination of them.
Mathias Bynens is the master of finding, investigating, and playing with quirky (yet often valid) bits of CSS and HTML.
A huge pile of information about SVG.…
Read Article →
The overall point here by Harry Roberts is to keep the specificity on your selectors as low as you can. The end result of that effort is:
I'm a big fan of resetting box-sizing to border-box, so much that we have a special day of the year around here. But there is a little adjustment to setting it that seems like a pretty good idea.…
Read Article →The following is a guest post by Ben Edwards. I saw Ben tweet about a simple Sass @mixin that allowed you designate bits of CSS as being "critical" - the idea being to load that critical CSS first and defer the loading of the rest of the CSS until later. A clever idea, and one that is getting very popular in the web performance crowd. I thought I'd get Ben to introduce these ideas in more detail for us.…
Read Article →
Clever work by Alex Sexton to analyze CSS and find colors that are so close to each other they should probably be combined. You know, for efficiency and consistency.
Ughck, accidental horizontal scrollbar, amiright?
That can be a pain, but you can usually find the offending element by surfing around the ol' DevTools and selecting elements until you find something that extends too far over to to the right (off-page to the left doesn't tend to trigger a scrollbar the same way) and adjusting it.
Sometimes I use the "Delete Node" feature of DevTools to remove stuff from the page until the scrollbar goes away. …
Read Article →
I'm probably a bit rare in that I rather enjoyed trying to keep up on the responsive images thing. It's an interesting problem that bred lots of interesting solutions. The whole thing is starting to wrap up now though, now that the official solutions are:
<picture> and friends<img> with srcset and sizesThe problem is: I don't really get it. I thought the original picturefill was pretty simple. List a bunch of sources with media queries. First one to …
Watch Video →*May or may not contain any actual "CSS" or "Tricks".