Button align center.
For align button center of the screen. We can use below two changes in dynamic layout of the button.
1) In 'presentation' tab
1.1)Custom CSS Class : centered
1.2) Inline style: margin-left : 20px
***Edited by Moderator: Pallavi to update platform capability tags***
P3Fusion
IN
Updated: 22 Jun 2022 16:37 EDT
Sopra Steria
NL
@Ramana.DSuggestion of @Abp69 should work, you could also create a helper class that uses something like 'justify-content:center;' (I'm not sure what the centered helper class does, but I imagine it may be older and use 'left:50%;margin:0;position:absolute;' or something like that).
Check out flexbox references, they're quite okay to implement :)
P3Fusion
IN
@BasRulesMatter Ahh you mean like the below css snippet for the helper class?
/****************************************
Type: helper-class
Name: centered
Category: layout,cell
Description: this layout will center the cell
*********************************************************/
.flex.content > .content-item.centered {
text-align: center;
}
Sopra Steria
NL
@Toddyt3 Yep! Also check out this reference: https://www.javatpoint.com/how-to-center-a-button-in-css . Most layouts and containers already add a bunch of classes that may or may not override one of the solutions here, but it should work :)
@Ramana.D
Hi, you can
Open Skin rule -> Create a new style format for Dynamic Layout -> Change Horizontal alignment to 'Center'.
Open your section rule, add a dynamic layout then under the presentation tab set the style format to the one you created in the above step.
Hope this was helpful!