How to add vertical separator between author and date on desktop

Hi Dan,

If you want to do this through CSS, here's something you can try:

p.gb-headline.gb-headline-097d2609::before {
    content: "|";
    margin-right: 20px;
}

The alternative way would be to add another inline Header Block in your Block Element, and add the separator through that.

Hi,
How do I remove the extra block on mobile and tablet?

I figured out the above.
Is there a way to center the text instead of having it skewed to the right like that

Don't place the Headline Blocks in a Grid. Just place them in one Headline Block.

Then, make all Headlines display - inline.

Then, center align the Container Block.

That should work.

How do I use multiple dynamic content in one headline block?
When I insert it, it only allows me to choose one type of dynamic content, then the whole thing is blacked out
That is why I have 2 headline blocks

As you can see here
https://pasteboard.co/Ni67gAd62jCf.png
The dynamic options can no longer be selected to add an additional dynamic field

I try to follow this tutorial
https://docs.generatepress.com/article/block-element-post-meta-template/
However it looks like the option for Post Meta Element type is no longer available

Just assign one Dynamic data per Headline. If you want them in one line, set the Display to inline. Reference: https://docs.generateblocks.com/article/layout-options-overview/#display

So I tried adding the using block and the second space is not displaying

It's still on a Grid from my end. Have you tried changing the structure into one the holds all the Headline Blocks in one Container Block?

Is it still a grid now?
It should not be

It is still a grid when I check.

Try clear the cache or diable the cache plugin.

It's not a grid.
I'm not sure how to make it not a grid
As you can see in the private field, the space exist in the preview but doesn't work on the live website.

After clearing cache I can see those meta elements are in the same container.

Now select the parent container of the meta elements, and set it to display:flex, justify-content: center, column-gap:10px.

For mobile, if you want the date wraps to the following line, set the container to flex-direction: column.

To hide the separator on mobile, add the hide-on-mobile class to the headline block.
https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/

Let me know if this works!