Archived topic

Icon to the right + alignet (heading block)

1 reply · Started by Matthias on March 15, 2022

Viewing posts 1–2 of 2

March 15, 2022 at 4:42 am #2155147

Hi there,

i want to have an arrow icon behind a list of headings.
I already found a solution by the support here to place the icon to the right.
Now i got 2 relating questions:
1. How to align the icons - the text should stay aligned on the left, but the icons should be on the right of the container (aligned in a row below each other - not like now after the text)
2. Can i add custom icons? I would prefer an arrow like this " -> "and not just the tip " >"

March 15, 2022 at 5:22 am #2155192

Hi there,

1. Change your CSS to this:

.gb-headline.reverse-icon > span.gb-icon {
    order: 2;
    margin-left: auto;
    padding-right: 0;
}

2. You can add any icon using the SVG HTML Field in the headline block ( and GB buttons block ):

https://docs.generateblocks.com/article/headline-overview/#icon

And this doc explains how to get the SVG HTML:

https://docs.generateblocks.com/article/adding-custom-svg-icons/

This archived topic is closed to new replies.

Start building better websites today.