Um kreisförmige Buttons, Icons oder Container zu erstellen, müssen folgende Parameter in den jeweiligen Block-Settings gesetzt werden:
Layout = Flex (Direction Row oder Column)
Align & Justify Content = Centered
Height & Width = jeweils gleicher Wert, z.B. 100px
Border Radius = 100%
Wenn man einen Container als Kreis mit Headlines als mittigen Inhalten bauen will, darauf achten, dass in der Headline die Margin-Bottom = 0 gesetzt wird, weil sonst automatisch der im Customizer definierte Line-Height für einen Abstand nach unten sorgt.
Hier ein Beispiel mit einem Container-Block, der einen Headline-Block enthält:
Hier ein Button-Block Beispiel:
Button 150pxFür Icons nutzt man einen Button oder Headline Block, wählt das Icon aus (oder setzt eines über das Feld Icon SVG HTML ein), und entfernt den Text.
Hier ein Beispiel mit einem Headline-Block als Icon (100px):
Übrigens sollte in keinem der Beispiele Padding verwendet werden.
In other words: “Add a Container Block, set the Layout to Display Flex, and Align Items Center and Justify Center. Then set the width and height to 100px and set the Border Radius to 100% and then add some text inside it.”