Welcome to Syntax. Today, we are talking about a bunch of new stuff in CSS and HTML.

There has been some big things added and some small things added, some nice quality of life things,

and some really exciting things that you cannot use just yet, but you can play around with.

There is just like an onslaught of new stuff. So we've collected a handful of these things and are going to be sharing with you today. My name is Scott Tillenski. I'm a developer from Denver with me as always as Wes Boss. What's up, Wes? I can't wait to talk about the HTML and Canvas thing. Honestly, I didn't even know that this was going to be a thing. I didn't even know this was an option. And now the world has opened up to me. Yeah. Yeah. Stop. My brain has been opened up by some of these demos for this. So I'm stoked to get into that too. So stay tuned, folks. We're going to be talking about what the heck HTML in Canvas is and why it's going to allow for crazy stuff

going on on the web. So the very first one I want to get into is something that has been

long awaited in CSS, which is the CSS Masonry API, aka the actual name for this thing

is CSS grid lanes. There's a display property, display grid lanes, and then you can specify using grid template columns, those types of things in Gap, the CSS properties that we know and love. The only difference is that the content actually filters in in the classic masonry Pinterest style layout.

This can be useful for all kinds of things beyond just your classic photo grids or things like that.

I saw it being used for like footer links to have the footer links all shuffle correctly.

This is kind of the best possible thing we could be adding as an implementation for the masonry style

layouts in CSS.

It's going to allow for the shuffling of elements in such a great way where in the past

we had CSS columns that were things went like one, two, three down vertically before going into the next column. This is actually going to do the opposite where things went like one, two, three, down vertically before going into the next column.

This is actually going to do the opposite where things will fill in kind of where they fit in,

left to right. They will just kind of fit. And you can actually do it right to left or up to down,

left to right. You can change all of that as well. But if you just want a straight-up masonry-style layout, man, display grid lanes can get any more simple than that?

It is really super cool.

That's it.

There's nothing to learn here.

It's simply just display grid lanes.

And now you can have multiple, like a Pinterest style layout which is something that

we have been trying to do forever and we've had like in we had what like box pack fit in csss

...