Safari 14.1 Adds Support for Flexbox Gaps

Yay, it’s here! Safari 14.1 reportedly adds support for the gap property in flexbox layouts. We’ve had grid-gap support for some time, but true to its name, it’s limited to grid layouts. Now we can use gap in either type …


The post Safari 14.1 Adds Support for Flexbox Gaps appeared first on CSS-Tricks.

You can support CSS-Tricks by being an MVP Supporter.


This content originally appeared on CSS-Tricks and was authored by Geoff Graham

Yay, it’s here! Safari 14.1 reportedly adds support for the gap property in flexbox layouts. We’ve had grid-gap support for some time, but true to its name, it’s limited to grid layouts. Now we can use gap in either type of layout:

.container {
  display: flex;
  flex-flow: row wrap;
  gap: 1.5rem;
}

Apple’s been rather quiet about the update. I didn’t even hear about it until Eric Meyer brought it up in an email, and he only heard about it when Jen Simmons tweeted it out.

I checked the WebKit CSS Feature Status and, sure enough, it’s supported. It just wasn’t called out in the release notes. Nothing is posted to Safari’s release notes archive just yet, so maybe we’ll hear about it officially there at some point. For now, it seems that Maximiliano Firtman‘s overview of iOS 14.5 is the deepest look at what’s new.

And how timely is it that Eric recently covered how to use the gap property, not only in grid and flexbox layouts, but multi-column as well.


The post Safari 14.1 Adds Support for Flexbox Gaps appeared first on CSS-Tricks.

You can support CSS-Tricks by being an MVP Supporter.


This content originally appeared on CSS-Tricks and was authored by Geoff Graham


Print Share Comment Cite Upload Translate Updates
APA

Geoff Graham | Sciencx (2021-04-30T21:51:08+00:00) Safari 14.1 Adds Support for Flexbox Gaps. Retrieved from https://www.scien.cx/2021/04/30/safari-14-1-adds-support-for-flexbox-gaps/

MLA
" » Safari 14.1 Adds Support for Flexbox Gaps." Geoff Graham | Sciencx - Friday April 30, 2021, https://www.scien.cx/2021/04/30/safari-14-1-adds-support-for-flexbox-gaps/
HARVARD
Geoff Graham | Sciencx Friday April 30, 2021 » Safari 14.1 Adds Support for Flexbox Gaps., viewed ,<https://www.scien.cx/2021/04/30/safari-14-1-adds-support-for-flexbox-gaps/>
VANCOUVER
Geoff Graham | Sciencx - » Safari 14.1 Adds Support for Flexbox Gaps. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/04/30/safari-14-1-adds-support-for-flexbox-gaps/
CHICAGO
" » Safari 14.1 Adds Support for Flexbox Gaps." Geoff Graham | Sciencx - Accessed . https://www.scien.cx/2021/04/30/safari-14-1-adds-support-for-flexbox-gaps/
IEEE
" » Safari 14.1 Adds Support for Flexbox Gaps." Geoff Graham | Sciencx [Online]. Available: https://www.scien.cx/2021/04/30/safari-14-1-adds-support-for-flexbox-gaps/. [Accessed: ]
rf:citation
» Safari 14.1 Adds Support for Flexbox Gaps | Geoff Graham | Sciencx | https://www.scien.cx/2021/04/30/safari-14-1-adds-support-for-flexbox-gaps/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.