--- title: Why UI designers should understand Flexbox and CSS Grid description: Learn why UI designers should understand Flexbox and CSS Grid for responsive design. Explore the differences between column-based design and modern CSS layouts. canonical: https://daily.dev/posts/why-ui-designers-should-understand-flexbox-and-css-grid-v88zodqdp twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Why UI designers should understand Flexbox and CSS Grid | daily.dev og:description: Learn why UI designers should understand Flexbox and CSS Grid for responsive design. Explore the differences between column-based design and modern CSS layouts. og:url: https://daily.dev/posts/why-ui-designers-should-understand-flexbox-and-css-grid-v88zodqdp og:image: https://api.daily.dev/og/posts/V88ZOdqDp.png og:image:alt: Why UI designers should understand Flexbox and CSS Grid og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Why UI designers should understand Flexbox and CSS Grid **[Community Picks](https://daily.dev/sources/community)** · 14 min read · 157 upvotes · 6 comments ## Summary Learn why UI designers should understand Flexbox and CSS Grid for responsive design. Explore the differences between column-based design and modern CSS layouts. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Community discussion Top comments from developers on daily.dev. **@fab978** · 2 upvotes > Nice **@ashishjohn** · 1 upvotes > ❤️ **@orcdev** · 1 upvotes > That's why we are getting lot of hybrids these days. Being a UI / UX + frontend dev is becoming normal. **@ombratteng** · 0 upvotes > I barely understand it myself 😬 --- Tags: [#css](https://daily.dev/tags/css), [#ui-design](https://daily.dev/tags/ui-design) [View this post on daily.dev](https://daily.dev/posts/why-ui-designers-should-understand-flexbox-and-css-grid-v88zodqdp) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Why UI designers should understand Flexbox and CSS Grid","url":"https://daily.dev/posts/why-ui-designers-should-understand-flexbox-and-css-grid-v88zodqdp","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/why-ui-designers-should-understand-flexbox-and-css-grid-v88zodqdp"},"datePublished":"2024-04-02T09:45:43.696Z","dateModified":"2024-05-09T08:29:02.242Z","description":"Learn why UI designers should understand Flexbox and CSS Grid for responsive design. Explore the differences between column-based design and modern CSS layouts.","image":"https://media.daily.dev/image/fetch/s--ww8jE2jh--/f_auto,pg_1,q_auto/https://miro.medium.com/v2/resize:fit:700/1%2A3kXC84krDTyrS6M0waGGug.gif?_a=BAMAMiZY0","thumbnailUrl":"https://media.daily.dev/image/fetch/s--ww8jE2jh--/f_auto,pg_1,q_auto/https://miro.medium.com/v2/resize:fit:700/1%2A3kXC84krDTyrS6M0waGGug.gif?_a=BAMAMiZY0","isAccessibleForFree":true,"articleSection":"Community Picks","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Community Picks","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1655817725/logos/community","url":"https://daily.dev/sources/community"},"commentCount":6,"discussionUrl":"https://daily.dev/posts/why-ui-designers-should-understand-flexbox-and-css-grid-v88zodqdp","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":157},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":6}],"keywords":"css,ui-design","timeRequired":"PT14M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Community Picks","item":"https://daily.dev/sources/community"},{"@type":"ListItem","position":3,"name":"Why UI designers should understand Flexbox and CSS Grid"}]} {"@context":"https://schema.org","@type":"WebPage","@id":"https://daily.dev/posts/why-ui-designers-should-understand-flexbox-and-css-grid-v88zodqdp","comment":[{"@type":"Comment","text":"Nice","datePublished":"2024-04-02T23:14:22.245Z","url":"https://daily.dev/posts/V88ZOdqDp#c-wtiAItlWe","author":{"@type":"Person","name":"Furqan ahmad","url":"https://daily.dev/fab978","image":"https://media.daily.dev/image/upload/s--GY0VPIs1--/f_auto/v1788339486/avatars/avatar_01YKXdhx6XxiWycQaD2rh?_a=BAMAMicg0"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":2}},{"@type":"Comment","text":"❤️","datePublished":"2024-04-13T03:56:52.406Z","dateModified":"2024-04-13T03:57:29.388Z","url":"https://daily.dev/posts/V88ZOdqDp#c-QPz9ikzLc","author":{"@type":"Person","name":"Ashish john","url":"https://daily.dev/ashishjohn","image":"https://lh3.googleusercontent.com/a/ACg8ocJ0cKKGzjfITenSZ4pxXTB73ZfVH6AF419-Puw7TMUyew=s96-c"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1}},{"@type":"Comment","text":"That’s why we are getting lot of hybrids these days. Being a UI / UX + frontend dev is becoming normal.","datePublished":"2024-04-02T10:38:01.986Z","url":"https://daily.dev/posts/V88ZOdqDp#c-ey1gR27vR","author":{"@type":"Person","name":"OrcDev","url":"https://daily.dev/orcdev","image":"https://avatars.githubusercontent.com/u/7549148?v=4"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1}},{"@type":"Comment","text":"I barely understand it myself 😬","datePublished":"2024-04-29T12:57:22.120Z","url":"https://daily.dev/posts/V88ZOdqDp#c-tWJAW1R9P","author":{"@type":"Person","name":"Ole-Martin","url":"https://daily.dev/ombratteng","image":"https://avatars.githubusercontent.com/u/1681525?v=4"}}]} ```