Is this your street address?

    Card

    ···· ···· ···· 4242
    Test card

    05/18

    Card

    Use a different card?

    Card

    pp paypal

    or pay with

    We do not keep any of your sensitive credit card information on file with us unless you ask us to after this purchase is complete.

    or pay with

    Please confirm your location:
    Your card will be charged .

    Thank you!

      Gumroad Library

      Download from the App Store or text yourself a link to the app

      Download from the App Store or text yourself a link to the app

      Send SMS
      Nevermind

      $12

      A Field Guide to Flexbox

      International shipping is no longer available following closing of presales, sorry!

      This is a 36 page, 4x6, premium paper weight, perfect bound, visual, booklet guide to getting started with CSS Flexbox layout; based on the wildly popular Flexbox Cheatsheet Cheatsheet with a few additional declarations and examples. A bonus PDF copy is included with purchase. 

      🍎 🍊 🍇 🍒 🍐 🍓

      The guide features redesigned fruit illustrations to communicate fundamental concepts and the impact of different container and item declarations. 

      A Field Guide to Flexbox serves as an endlessly handy, printed introduction to using flexbox but also as a beautiful addition to your workspace. While it’s not an exhaustive look at using this technology, it’s perfectly suited for those just getting started or for the rest of us that just can’t seem to remember all these options and need a reference to carry around. 

      For news keep an eye on the site or Twitter. To take a look at some preview images check out the announcement blog post

      A PDF only copy can be purchased here

      Table of Contents

      Foundational Concepts.....6

      Activate Powers.................9

      Container Declarations.....11

          Rows................................12

          Columns...........................13

          Main axis location............14

          Wrapping..........................17

          Cross axis location...........19

          Multi-line alignment...........22

      Item Declarations................26

          Order..................................27

          Grow..................................28

          Shrink................................29

          Alignment..........................30

      Additional Resources..........34

      Layout

      The small guide presents common questions regarding layout intentions and responds to different options with properties and values, as well as the visual implications of each choice. There are page numbers on each page next to a section title as a reminder; especially helpful in recalling whether or not a declaration is intended to be placed on a container or item element, for example. 

      The first and final two pages are reserved for some rad fruit art. 

      Details, Logistics

      Interior pages consist of full color ink on uncoated smooth 100# text paper, while the cover is full color 120# cover paper with gloss coating. There will be stickers included as well because it’s just the right thing to do 🍇 🐷  

      International shipping is no longer available. Shipping within the USA is $3.00, which is added during checkout. A slight discount is applied to orders of 2+ booklets.

      A PDF copy will be available for immediate download upon completing purchase. 

      Printed in the USA.

      Neat Words of Praise

      “I can never remember the flexbox properties, so I’m thrilled to have A Field Guide to Flexbox by my side. Joni’s illustrations are equal parts delightful and easy to follow, making it my new go-to resource.” — Katy DeCorah, web developer

      “This handy guide is a wonderful resource, especially for a visual learner, like myself. Joni does a great job of breaking down fundamental concepts into easy to understand (and super cute!) bite sized pieces. If i had a guide like this for all web design concepts I’d be golden.” — Shanise Barona, web developer

      “I like the watermelon the best. They are tasty tasty.” — Ben Trythall, 5 years old 

      Sorry, this item is not available in your location.
      Sold out, please go back and pick another option.
      This product is not currently for sale.
      • Size 417 KB
      • Length 40 pages

      Is this your street address?

      Card

      ···· ···· ···· 4242
      Test card

      05/18

      Card

      Use a different card?

      Card

      pp paypal

      or pay with

      We do not keep any of your sensitive credit card information on file with us unless you ask us to after this purchase is complete.

      or pay with

      Please confirm your location:
      Your card will be charged US$12.

      Your rental will be available for 30 days. Once started, you’ll have 72 hours to watch it as much as you’d like!

      Thank you!

        Gumroad Library

        Download from the App Store or text yourself a link to the app

        Download from the App Store or text yourself a link to the app

        Send SMS
        Nevermind