どのようにして、円ディビジョンの中にcommandLinkを置くことができますか？

私は、円のdiv内にprimefaces Commandlink要素を配置したいが、それはうまく動作しない。どのようにして、円ディビジョンの中にcommandLinkを置くことができますか？

これは私が今持っているものです。

.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を置くことができますか？

答えて

関連する問題