Responsive Images: If you’re just changing resolutions, use srcset.

Responsive Images: If you’re just changing resolutions, use srcset.

If you're implementing responsive images (different images in HTML for different situations) and all you are doing is switching between different versions of the same image (the vast majority of usage), all you need is the srcset attribute...

#

Author:

Category: CSS

Tags: , ,

Thoughts on Pagination

Thoughts on Pagination

I've had some disparate thoughts regarding pagination lately, so I thought I'd attempt to organize them in a post. That's how blogging works right? Consistent Positioning If there is any way to make sure your pagination buttons don't...

#

Author:

Category: CSS

Tags: , ,

The Game of Life

The Game of Life

It's not really a "game" - but more like a set of rules by mathematician John Horton Conway. Imagine a grid of cells, like a spreadsheet or a <table> . Each cell is either alive or dead. ...

#

Author:

Category: CSS

Tags: , , ,

Don’t use `picture` (most of the time)

Don’t use `picture` (most of the time)

Jason Grigsby: Unless you're solving for art direction, you don't need to the element. In fact, you're likely doing your users a disservice by using the <picture> element. I'd wager that the majority of "responsive images" use is...

#

Author:

Category: CSS

Tags: , , ,

Build Web Layouts Easily with Susy

Build Web Layouts Easily with Susy

I've been coming around to the idea of using Susy (a Sass add-on for grids) lately. ...

#

Author:

Category: CSS

Tags: , ,

The Bézier Game

The Bézier Game

A game to help you master the pen tool. By Mark MacKay. ...

#

Author:

Category: CSS

Tags: , ,

Getting Started with CSS Shapes

Getting Started with CSS Shapes

I just watched Jen Simmons give a talk Modern Layouts: Getting Out Of Our Ruts and she had some great examples of how easy CSS shapes are to use, even with safe progressive enhancement. If you haven't heard...

#

Author:

Category: CSS

Tags: , , , ,

Scroll-Then-Fix Content

Scroll-Then-Fix Content

A reader sent me in a GIF showing off a cool effect they saw on Google on mobile. (Presumably the homepage you see when you launch Chrome on Android?) There is a search input in the middle of...

#

Author:

Category: CSS

Tags: , ,

A Look at SVG Light Source Filters

A Look at SVG Light Source Filters

The following is a guest post by Joni Trythall. Joni recently finished a Pocket Guide to Writing SVG . I've been excited about SVG for a while now, working with it, learning about it, writing about it.....

#

Author:

Category: CSS

Tags: , , , ,

Sponsor: Hack Reactor – New Remote Beta Classes

Sponsor: Hack Reactor – New Remote Beta Classes

With the success of their first online cohort, Hack Reactor is happy to announce two new Remote Beta classes. Aspiring engineers no longer need to relocate to San Francisco in order to attend their 12-week immersive JavaScript coding...

#

Author:

Category: CSS

Tags: