YoVDO

How to Create CSS Masonry Layouts

Offered By: Envato Tuts+ via YouTube

Tags

HTML & CSS Courses Web Design Courses Flexbox Courses

Course Description

Overview

Explore the creation of CSS masonry layouts in this 37-minute video course. Discover the concept of masonry layouts, commonly seen on platforms like Pinterest, where content cards are displayed in a staggered manner. Learn three different CSS-only techniques to achieve this effect without relying on JavaScript: multi-column layout, Flexbox, and CSS Grid. Follow step-by-step instructions to implement each method, understand their advantages and limitations, and gain practical insights into modern CSS layout techniques. Access provided resources, including CodePen demos, MDN documentation, and browser support information, to enhance your learning experience and apply these skills to your web design projects.

Syllabus

Introduction.
What Is a Masonry Layout?.
Masonry With Multi-Column Layout.
Masonry With Flexbox.
Masonry With CSS Grid Layout.


Taught by

Envato Tuts+

Related Courses

Agrega estilo a una página HTML usando CSS
Coursera Project Network via Coursera
Basic User Interface Design for Web Developers
Coursera Project Network via Coursera
Build Restaurant Business Website using Google Sites
Coursera Project Network via Coursera
بناء موقع بسيط عن الكتب باستخدام html و css
Coursera Project Network via Coursera
Building High Quality User Experience Using Material UI
NIIT StackRoute via Coursera