Как я могу центрировать commandLink внутри кругового Div?

Я хочу, чтобы центрировать элемент Commandlink внутри кругового div, но он просто не работает.Как я могу центрировать commandLink внутри кругового Div?

Это то, что у меня есть прямо сейчас.

.createButton { 
 

 
    background-color: #ffffff; 
 
    border-color: #2C3449; 
 
    border-width: 3px; 
 
    border-radius: 50px; 
 
    width: 50px; 
 
    height: 50px; 
 
    margin-right: 20px; 
 
    position: relative; 
 
    left: 95%; 
 
    top: 22px; 
 
} 
 
.addCustomerIcon{ 
 
    z-index:1; 
 
    position:relative; 
 
    top:0; 
 
    left:0; 
 
    width:auto; 
 
    max-width:100%; 
 
    height:auto; 
 
    max-height:100%; 
 
}

<html xmlns:p="http://primefaces.org/ui"> 
 
<div class="createButton"> 
 
    <p:commandLink update=":editForm" onsuccess="PF('createCustomer').show();" process="@this" actionListener="#{customerController.initialize()}"> 
 

 
    <i class="fa fa-plus fa-2x addCustomerIcon"></i> 
 

 
    </p:commandLink> 
 
</div> 
 

 
</html>

Я знаю, что этот фрагмент не показывает ничего, но я думаю, что это из-тегов Primefaces.

Так что мой вопрос. Как я могу центрировать эту кнопку внутри div?

источник

2017-02-15 Frekell

.addCustomerIcon { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%,-50%); 
}

источник

2017-02-15 14:26:45 arturmoroz

Спасибо, что помогли мне. – Frekell

Как я могу центрировать commandLink внутри кругового Div?

ответ

Смежные вопросы