Getting Icons To Align With The First Line Of A Headline Block

Hi there,

it would require CSS:

.floated-icon {
    display: block !important;
}
.floated-icon .gb-icon {
    float: left;
    position: relative;
    top: 5px;
}

And then add the floated-icon class to the headlines you want to apply it to.

Hi David, thanks for that! Can I indent the entire content in the headline, so it matches up with the first line? I've attached a screenshot, so you can see what I mean.

If you just want the icon to be at the top instead of center.
Then select the headline block with the icon, and in the Layout options set the align content to flex start ( the top align icon )

Hi David, that's great, thank you. I just want the icon in line with the first line of text of the headline block. Is that possible? Thanks so much for your help!

Hi Jodie,

Can you try setting the Headline Block's display to inline?

Reference: https://docs.generateblocks.com/article/layout-options-overview/

Hi Fernando, I tried that, but it doesn't achieve the outcome I'd like it to. Any ideas on how to fix it? Thank you as always!

Keep it inline, then give it a class of turn-inline

Adding Custom Classes: https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/

Then, add this CSS:

.gb-headline.turn-inline span{
    display: inline;
}

Thanks very much Fernando

You're welcome, Jodie!