RC4 - how to? add row element within a header container

Beta
#1

Hi Guys…

Not strictly Beta, but I’m trying to create blocks within blocks (ie like the row element) in the header builder

is there a way of doing this please?

I suppose Global blocks could be a way forward but wondered if there was a way within the header builder

Thanks

#2

We’ve not broached this in the Header/Footer builders just yet, so for now Global Blocks is the only way. We’ve discussed making the “Container” element nest-able which would give you deeper positioning contexts with flexbox, but haven’t decided if we should do that just yet, or what that would look like. I’ve also thought about making the Container available in all the builders as a very generic element that you can put anything in (basically a div). For now we’ve not landed on anything just yet.

2 Likes
#3

Thanks for the reply @alexander

What would be even more interesting would be how CSS grid could be applied to the header, but I’m guessing that is next level beyond the upcoming CSS Grid changes

I did manage to do a workaround in the header (see the secure note), but think headers could get quite interesting with nestable elements

#4

Looks great! Yeah, that will be interesting indeed. Out of the gate we won’t have Grids in the Header/Footer builder, but they will be an important part of the Layout Builder. Layouts you create can be assigned to different contexts, so you could actually make something that works as a header that way - it just won’t have access to Bars.

#5

I’m assuming it would be possible to use css grid within a global block within the header?

Just thinking possibilities

#6

Yes! Certainly a possibility. It obviously wouldn’t have the grid builder, but you would be able to get the same front end result. Generally speaking, a Global Block is a good way to isolate something across builders.