logo

CSS Grid Layout tutorial | Magazines

time2 yr agoview3 views

In this video, Juan shows briefly how you can apply our grid layout feature to a magazine layout as well.

This functionality is a completely new and unique way of distributing the elements of a layout in a bi-dimensional and responsive manner. This new way of laying out the elements translates straight into CSS code that saves time and makes things easier for devs.


Penpot is the first open-source collaborative design tool that bridges the gap between designers and developers.

Penpot allows a true collaboration between designers and developers thanks to features like Flex Layout and Code Inspect. It’s the only one that can be web based or self-hosted. The tool works with open web standards (SVG) avoiding vendor lock-in and giving teams absolute freedom in their designs.

You can use it for your mockups, webs, apps and any other type of UX & UI Design

  • Penpot Community - https://community.penpot.app

Design: https://penpot.app​​ Help: https://help.penpot.app​ Contribute: https://github.com/penpot Flex Layout: https://penpot.app/layout Penpot Fest: https://penpotfest.org

Follow us:

  • X: https://twitter.com/penpotapp ​​
  • Instagram: https://www.instagram.com/penpot.app/
  • Github: https://github.com/penpot
  • Mastodon: https://fosstodon.org/@penpot/​
  • LinkedIn: https://www.linkedin.com/company/penpotdesign

Penpot: Bring Design Collaboration between Designers and Developers.

Loading comments...