‘CSS Grid’ Videos

  • Jessica Lyschik: CSS Grid in freier Wildbahn

    Jessica Lyschik: CSS Grid in freier Wildbahn

    WordCamp Stuttgart 2019Speaker: Jessica Lyschik

    November 10, 2019 — Seit CSS Grid im Jahr 2017 in modernen Browsern eingeführt wurde, können Entwickler endlich komplexe Layouts mit weniger Code erstellen. Allerdings funktioniert CSS Grid etwas anders als das, was Entwickler bisher mit CSS Frameworks umgesetzt haben. In diesem Talk möchte ich Beispiele zeigen, wie ich CSS Grid bisher auf Websites eingesetzt habe. Dazu gibt es noch Tipps für Fallback-Layouts, falls doch noch ältere Browser wie Internet Explorer 10 oder 11 unterstützt werden müssen. Denn das sollte heute keine Ausrede mehr sein, CSS Grid nicht zu benutzen!

    Presentation Slides »

  • Jessica Lyschik: CSS Grid in the Wild

    Jessica Lyschik: CSS Grid in the Wild

    WordCamp Zurich 2019Speaker: Jessica Lyschik

    September 25, 2019 — Since CSS Grid was introduced in modern browsers in 2017, developers finally are able to create complex layouts with less code. CSS Grid works a bit differently than the CSS frameworks developers are used to, so there’s a learning curve to get it. In this talk I want to show some examples how to use CSS Grid on websites, including either support or fallback layouts for Internet Explorer 10 and 11. Because this shouldn’t be an excuse anymore not to use CSS Grid today!

    Presentation Slides »

  • Tiffany Kuchta: CSS Grid IRL

    Tiffany Kuchta: CSS Grid IRL

    WordCamp Asheville 2018Speaker: Tiffany Kuchta

    January 8, 2019 — The murmuring about CSS Grid in the world of frontend development has gotten quite loud indeed. If you’ve been a developer awhile, you remember when CSS finally became powerful enough to overtake the almighty table. You probably also really love the incredible tool that is Flexbox, even if you, like I do, still need to reference the same darn CSS Tricks article every time you use it. So what’s Grid’s deal? What makes it so great anyway, and when can you start using it IRL? What if you don’t want to duplicate development, building complex fallbacks for legacy browsers? How do you decide if a project is a good fit for CSS Grid, and then how do you even get started? We’ll discuss these questions, review some tools and tricks, and look at a few examples of CSS Grid in action.

    Takeaways:

    Using CSS Grid
    Recognizing when CSS Grid is a good fit
    Fallbacks /Supporting old browsers

    Presentation Slides »

  • Juan Pablo Gomez: CSS Grid, Gutenberg and the future of Layouts

    Juan Pablo Gomez: CSS Grid, Gutenberg and the future of Layouts

    WordCamp Toronto 2018Speaker: Juan Pablo Gomez

    December 28, 2018 — Released last year, CSS Grid changes everything for the web and the WordPress communityIt means that, for the first time, we can think of layout on posts and pages as two-dimensional and fully responsive. CSS Grid is not another plugin hack or bootstrap patch. Quite simply, it’s the solution for which designers have been asking. It is here to stay and right now is the perfect time to learn it.
    Why CSS Grid? How to use Grid? When to use Grid? Demos!

    Presentation Slides »

  • Jessica Lyschik: Einstieg in CSS Grid
  • Jessica Lyschik: Einstieg in CSS-Grid
  • Mike Herchel: The New Styles

    Mike Herchel: The New Styles

    WordCamp Jacksonville 2018Speaker: Mike Herchel

    July 27, 2018 — The pace of modern front-end development doesn’t let up. New standards, APIs, techniques, and best practices are being introduced on a monthly basis.

    This presentation will walk a front-end developer through vital new standards that we will be seeing more frequently.

    This includes

    – Deep dive into CSS Grid
    – CSS Custom Properties (aka CSS Variables)
    – Positioning
    – CSS Filters and Blend Modes
    – And more

    The topics will be presented to focus on the basic terminology, usage, concepts, and techniques of these new standards

    Presentation Slides »

  • Mary Baum: CSS Grid

    Mary Baum: CSS Grid

    WordCamp Miami 2018Speaker: Mary Baum

    July 10, 2018 — Are you thinking about CSS grids for your layouts? Browser support is just about here.

    I’ve been looking hard at the work of Jen Simmons and Rachel Andrew, the two people writing most of the material to teach us designer/dev types what we need to know to start using this new spec.

    And thanks to some time I’ve spent playing on CodePen, I think I’m ready to use grids in WordPress!

    So let’s look at:
    – WHAT CSS grids are.
    – WHERE it makes sense to use them.
    – HOW they help us make previously tough problems solve themselves.
    – WHY grids are not just great for symmetrical layouts – but also wildly asymmetrical ones as well.
    – And I’ll see you on the grid!

    Presentation Slides »

  • Juan Pablo Gomez: CSS Grid is here!

    Juan Pablo Gomez: CSS Grid is here!

    WordCamp Paris 2018Speaker: Juan Pablo Gomez

    April 24, 2018 — CSS Grid was released in 2017 and it changes everything; for the web and for the WordPress Community. It means that for the first time we get to think of our layout as two dimensional and fully responsive. CSS Grid is not another plugin hack or another bootstrap patch, it was the solution designers have been asking for. It’s here to stay and it’s the perfect time to learn it!

    Presentation Slides »

  • Dan Robert: Getting Started with CSS Grid

    Dan Robert: Getting Started with CSS Grid

    WordCamp Greenville 2018Speaker: Dan Robert

    April 3, 2018 — CSS Grid Layout is a powerful system available in CSS, which simplifies existing patterns and adds new possibilities for layout methods in our websites and applications. It is a 2-dimensional system, meaning it can handle both columns and rows.

    This talk covers an introduction of the CSS Grid Layout specification and follow up with some practical examples of how we can begin to use it in practice today.

    Presentation Slides »