2017-02-15 28 views
0

我想在一個圓形div裏面放置一個primefaces Commandlink元素,但它不會工作。如何將一個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標籤。

所以我的問題是。我怎樣才能把這個Button放在div裏面?

回答

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

感謝您的幫助。 – Frekell