Skip to main content
Home / Articles /

10 modern layouts in 1 line of CSS

Avatar of Chris Coyier
Author
Chris Coyier
3 Comments
Join Conversation
Published

MailChimp: Grow sales with Customer Journey Smarts

MailChimp / Google Impression Tracker 'pixel' image tracker

Una doing an amazing job of showing just how (dare I say it?) easy CSS layout has gotten. There is plenty to learn, but what you learn makes sense, and once you have, it’s quite empowering.

The demos are all together here.

Direct Link →

Frontend Masters logo

Wanna learn modern CSS layout?

Laying out designs on the web with CSS has gotten a lot more powerful in recent years. CSS grid and flexbox are incredibly powerful tools for that, and Frontend Masters has a complete learning course on them from Jen Kramer.

Comments

  1. User Avatar
    Peter
    Permalink to comment#

    “10 single-line CSS layouts”
    I surely like to see those.
    “10 modern layouts in 1 line of CSS”
    This feels like you are pulling my leg.

    Reply
    • User Avatar
      Mohammed
      Permalink to comment#

      There’s a button that says “direct link” at the bottom of the post that’ll take you to those 10 layouts

  2. User Avatar
    Eric
    Permalink to comment#

    Thanks Una! I definitely picked up a few new tricks from your presentation.

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

You may write comments in Markdown thanks to Jetpack Markdown. This is the best way to post any code, inline like `<div>this</div>` or multiline blocks within triple backtick fences (```) with double new lines before and after. All comments are held for moderation. Be helpful and kind and yours will be published no problem.

We have a
Code of Conduct. Be cool. Be helpful. The web is a big place. Have fun. High five.
Jetpack Logo

The related posts above were algorithmically generated and displayed here without any load on my server at all, thanks to Jetpack.