У меня есть следующий код компонента, который я пытаюсь использовать для центрирования кнопки на странице. Он продолжает отображаться с выравниванием по левому краю. Я пробовал использовать тег <center> и slds-align_absolute-center. Ни изменить левое выравнивание, которое я вижу.

<div class="slds-form-element buttons slds-text-align_center">
    <lightning:button class="slds-button slds-button--brand"  variant="brand" onclick="{!c.createNew}" label="{!v.ButtonLabel}" aura:id="formSubmit"/>
</div>
2
Oleh Berehovskyi 18 Окт 2019 в 14:48
Попробуйте этот класс class="slds-align_absolute-center"
 – 
Pavan tej
18 Окт 2019 в 14:49
Я только что попробовал еще раз, и это не сработало. По-прежнему выравнивается по левому краю.
 – 
Michele Kleinhomer
18 Окт 2019 в 14:53
Я понял. Мне пришлось удалить class="slds-form-element", чтобы центральный класс работал.
 – 
Michele Kleinhomer
18 Окт 2019 в 15:03
Я думал, вы уже удалили!. Я опубликую свой ответ, пожалуйста, закройте вопрос
 – 
Pavan tej
18 Окт 2019 в 15:11

1 ответ

Лучший ответ

Для того, чтобы выровнять кнопку по центру. нам нужно использовать класс Absolute Center в расположении slds.

<div class="slds-align_absolute-center" style="height:5rem">
    <lightning:button />
</div>

Для получения дополнительной информации: https://www.lightningdesignsystem.com/utilities/alignment/

2
Pavan tej 18 Окт 2019 в 15:15