Category CSS

CSS is the language for styling websites, including their colors, layouts, and typography. With CSS, you can propagate styles to your HTML components, ensuring a consistent design across all types of devices, browsers, and operating systems. We highly recommend Heydon Pickering’s introduction to two key CSS features on creating consistent designs with minimal effort, in addition to using Semantic CSS With Intelligent Selectors.

Introducing LiveStyle: Better, Stronger And Smarter CSS Live Reload

by Sergey Chikuyonok

15 min read
No meows just yet

August 8, 2013 — Tools for live CSS editing aren’t new these days. You may already be familiar with tools like LiveReload, CodeKit and Brackets. So, why would someone ever need to create yet another tool and ... Read More…

248 more articles

Robin Rendle wrote

The “Other” Interface: Atomic Design With Sass

August 2, 2013 — As front-end developers and designers, we’re constantly refining two interfaces simultaneously: one for visitors who load the website, the other for developers who have to tackle the code in the future, when adjustments or full-scale redesigns must be made. Read More…

Stephen Thomas wrote

Simple Responsive Images With CSS Background Images

July 22, 2013 — With all the talk of new HTML5 standards such as the srcset attribute and <picture> element, as well as server-side techniques such as Responsive Web Design + Server Side Components (RESS), you’d be forgiven for concluding that simple, static websites can’t … Read More…

Tyson Matanich wrote

Media Queries Are Not The Answer: Element Query Polyfill

June 25, 2013 — Responsive Web design has transformed how websites are designed and built. It has inspired us to think beyond device classifications and to use media queries to adapt a layout to the browser’s viewport size. This, however, deviates from the hierarchical structure of CSS and … Read More…

Estelle Weyl wrote

How To Solve Adaptive Images In Responsive Web Design

June 3, 2013 — Adaptive images are the current hot topic in conversations about adaptive and responsive Web design. Why? Because no one likes any of the solutions thus far. New elements and attributes are being discussed as a solution for what is, for most of us, a big headache: to provide … Read More…

Wilson Page wrote

Building The New Financial Times Web App (A Case Study)

May 23, 2013 — When the mockups for the new Financial Times application hit our desks in mid-2012, we knew we had a real challenge on our hands. Many of us on the team (including me) swore that parts of interface would not be possible in HTML5. Read More…

David Storey wrote

Flexbox Is As Easy As Pie: Designing CSS Layouts

May 22, 2013 — Flexible box layout (or flexbox) is a new box model optimized for UI layout. As one of the first CSS modules designed for actual layout (floats were really meant mostly for things such as wrapping text around images), it makes a lot of tasks much easier, or even possible at … Read More…

Dmitry Semenov wrote

Magnific Popup, A Truly Responsive Lightbox Plugin

May 2, 2013 — A lightbox is one of those tools that work great on the desktop but often fail on small mobile devices. These days, finding a plugin that is responsive and that displays content right away is hard. For this reason, I created Magnific Popup, an open-source lightbox plugin … Read More…

Rodney Rehm wrote

CSS3 Transitions: Thank God We Have A Specification!

April 26, 2013 — This article is packed with a number of quirks and issues you should be aware of when working with CSS3 transitions. Please note that I’m not showing any workarounds or giving advice on how to circumvent the issues discussed. Read More…

Gabriele Romanato wrote

How To Benefit From CSS Generated Content And Counters

April 12, 2013 — Generated content was first introduced in the CSS2 specification. For several years, the feature was used by relatively few Web authors due to inconsistent browser support. Read More…