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.

Naming Things In CSS Grid Layout

by Rachel Andrew

18 min read
No meows just yet

October 17, 2017 — When first learning how to use Grid Layout, you might begin by addressing positions on the grid by their line number. This requires that you keep track of where various lines are on the grid, and also ... Read More…

248 more articles

Cosima Mielke wrote

CSS Grid Challenge: Winners and Templates

October 6, 2017 — CSS Grid is becoming the new layout standard for the web, and we are all still experimenting with what we can achieve with it. Read More…

Rachel Andrew wrote

CSS Grid Gotchas And Stumbling Blocks

September 28, 2017 — CSS Grid is such a different way of approaching layout that there are a number of common questions I am asked as people start to use the specification. This article aims to answer some of those, and will be one in a series of articles on Smashing Magazine about layouts. Read More…

Vitaly Friedman wrote

Uploading Directories At Once With webkitdirectory

September 19, 2017 — If you’ve ever tried to implement a bulletproof, good-looking file uploader, you might have encountered an issue: uploading an entire folder or folders of files is usually quite a hassle, as files in each folder have to be selected manually. And then some folders might … Read More…

François Poizat wrote

How New Font Technologies Will Improve The Web

September 18, 2017 — Words are the primary component of content for the web. However, until a short while ago, all we had at our disposal were but a few system fonts. Adding to that, those system typefaces weren’t necessarily coherent from operating system to operating system (OS). Fortunately, … Read More…

Vitaly Friedman wrote

The CSS Grid Challenge: Build A Template, Win Some Smashing Prizes!

September 6, 2017 — Layout on the web has always been tricky, but with CSS Grid being now supported in all major browsers, most of the hacks that helped to achieve complex layouts have become obsolete. Read More…

Tom Greever wrote

The Nine Principles Of Design Implementation

August 14, 2017 — Recently, I was leading a training session for one of our clients on best practices for implementing designs using HTML and CSS. Part of our time included a discussion of processes such as style-guide-driven development, approaches such as OOCSS and SMACSS, and modular … Read More…

Manuel Matuzović wrote

Progressively Enhancing CSS Layout: From Floats To Flexbox To Grid

July 24, 2017 — Earlier this year, support for CSS grid layout landed in most major desktop browsers. Naturally, the specification is one of the hot topics at meet-ups and conferences. After having some conversations about grid and progressive enhancement, I believe that there’s a good … Read More…

Morten Rand-Hendriksen wrote

Building Production-Ready CSS Grid Layouts Today

June 16, 2017 — Industries often experience evolution less as slow and steady progress than as revolutionary shifts in modality that change best practices and methodologies seemingly overnight. This is most definitely true for front-end web development. Our industry thrives on constant, … Read More…

Jake Wilson wrote

Fluid Responsive Typography With CSS Poly Fluid Sizing

May 15, 2017 — Fluid layouts have been a normal part of front-end development for years. The idea of fluid typography, however, is relatively new and has yet to be fully explored. Up until now, most developers’ idea of fluid typography is simply using Viewport units maybe with some … Read More…