Skip to main

Tag: Layout

For more posts, return to the full posts list or browse all tags.

2024 Posts

  1. A cat sitting in a box
thinking OMG.
I have so many questions
for this damn box.
    Talk post type

    Cascading Layouts

    A workshop on resilient CSS layouts

    Upcoming
    • – Online

      Cascading Layouts OddWorkshop

    see all Talks & Workshops
  2. Article post type

    Partial Feature Queries, Relaxed Layout Containment, and More

    CSS Working Group updates from July

    Over the last month, the CSS Working Group has determined we can loosen containment restrictions for query containers, and agreed on a syntax for special-case support queries (like support for the gap property in a flex context, or support for align-content in a block flow context).

    see all Article posts
  3. Winging It post type

    Learn CSS Grid First

    We talk with Stephanie Eckles – the brain behind ModernCSS.dev and SmolCSS.dev – about CSS grids. We look at a few of the most common grid patterns, to show you how (and why) you can get started working grids into your CSS toolkit!

    see all Winging It posts
  4. A dog zooming by the camera, up-close, body twisted and eyes wide as it circles a grass yard
    Article post type

    Zoom, zoom, and zoom

    The three types of browser (and CSS!) magnification

    I’m working on an article about fluid typography, and relative units. But instead, I fell down this rabbit hole – or a cleverly-disguised trap? – trying to understand ‘zoom’ in the browser (not Zoom™️ the software). Since I couldn’t find any up-to-date articles on the subject, I thought I shoul…

    see all Article posts
  5. A back hoe on the bank of the Suez, trying to free the Ever Given cargo ship
    Article post type

    Learn Grid Now, Container Queries Can Wait

    Take your time with new CSS, but don’t sleep on the essentials

    Several people have asked recently why container queries aren’t being used more broadly in production. But I think we underestimate the level of legacy browser support that most companies require to re-write a code-base.

    see all Article posts

2020

  1. see all Talks & Workshops
    Miriam speaking at Develop Denver, 2019
    Talk post type

    Dynamic CSS

    with grids & custom properties

    Past
    • – Online

      Shift Remote

    • – Denver, CO

      Develop Denver

2019

  1. see all Talks & Workshops
    Giant pencil awarded to Miriam Suzanne for Best of CSS Dev Conf 2017
    Talk post type

    Don’t Use My Grid System

    It’s time to move past grid systems like Susy

    Past
    • – Boulder, CO

      Boulder Python

    • – San Francisco, CA

      Covalence Conf

2017

  1. Bar graph chart
    Link post type

    More CSS Charts, with Grid & Custom Properties

    Inspired by Robin Rendle, I demonstrate some of my early experiments combining CSS Grids and custom properties to create dynamic layouts and data-visualizations.

    see all Link posts
  2. CSS-Tricks
    Link post type

    Fun with Viewport Units

    Viewport units have been around for several years now, with near-perfect support in the major browsers, but I keep finding new and exciting ways to use them. I thought it would be fun to review the basics, and then round-up some of my favorite use-cases.

    see all Link posts

2016

  1. see all Article posts
    CSS Grid example layout
    Article post type

    Will CSS Grid Layout Enable Creative Design?

    CSS Grid Layout is shaping up to be the layout tool we’ve always wanted on the web. How can we use it to start creating interesting layouts?

2014

  1. see all Talks & Workshops
    Susy is not a grid system
    Talk post type

    Your Own Damn Susy System

    an introduction to the Susy layout toolkit

    Past
    • – Baltimore, MD

      Bmore Sass

    • – San Francisco, CA

      The Mixin

2013

  1. Article post type

    Susy Next, Alpha 5

    Susy Next alpha 5 is out, and loaded with changes. We now require Sass 3.3, we no longer require Compass, and there have been major syntax improvements. We’re getting real close to launch, and we’d love to know what you think. Play around, and let us know!

    see all Article posts
  2. Article post type

    Susy Next, Alpha 4

    Susy Next alpha 4 is now available.

    see all Article posts
  3. Article post type

    Susy Next, The Second Alpha

    Go download & play with it!

    We haven’t written full docs yet, and this blog post will be vastly incomplete, but I’ll give you a quick rundown of where we’re going. This is all open to change, of course. There’s a reason we’re still in alpha.

    see all Article posts
  4. Article post type

    Isolation and Bleed in Susy

    A few new features have landed in Susy 1.0.7, even as we work on more integrated syntaxes for 2.0. The isolate() and isolate-grid() mixins help you manage the worst effects of sub-pixel rounding, while bleed() helps you break items out of the box.

    see all Article posts
  5. Article post type

    Susy Next, The First Alpha

    Last night we released the very first alpha build of Susy Next. This release is extremely sparse. What we have built is a background ‘engine’ for calculating grid math. There are some rough first steps towards api and syntax, but they are more “proof of concept” experimentation than usable interface.

    see all Article posts
  6. see all Article posts
    Article post type

    Sass Layout in 2013 and the Future of Susy

    The web is littered with grid systems and ‘frameworks’ that force your code & design into narrowly defined patterns. Even the most semantic of us have had to push specialized techniques in order to create a usable syntax.

    But Sass has come a long way, and I’m convinced that it’s time for something new.

    What if you had a layout system that bends completely to the needs of your site? What if you could use one unified syntax for handling responsive layouts of any kind? What if you had a modular system that let you mix-and-match to customize for every site, and change your output with simple extensions?

2012

  1. see all Article posts
    Article post type

    Off-Canvas Layout with Susy

    The off-canvas layout pattern for responsive web design has been getting all the attention lately, and I’ve had several people ask how Susy One might play along. I’ll show you how easy it is, and how much flexibility Susy can add along the way.