在移動網站

Question

圍繞按鈕我對這個頁面底部的觸摸按鈕獲取：

在網站的移動版本（小於770px），我想它的中心。

HTML：

<div class="white, home_contact_btn wpb_column vc_column_container vc_col-sm-4"> 
    <div class="wpb_wrapper"> 
     <a class="laborator-btn btn btn-index-1 btn-type-standard contact-btn btn-primary btn-normal" target="" title="GET IN CONTACT" href="http://www.estiponagroup.com/dev/contact/">GET IN TOUCH</a> 
    </div> 
</div> 

CSS

.home_contact_btn a{ 
    margin:0 auto; 
    text-align:center; 
} 

Answer 1

的錨是固有的內聯元件，並且可以通過施加text-align:center;到它的父元素爲中心：

.wpb_wrapper{ 
    text-align:center; 
} 

此外，如果你希望它的中心沒有針對父母，你可以使內聯元素顯示爲塊級元素，然後將文本置於其中。

.home_contact_btn a{ 
    display:block; 
    text-align:center; 
} 

最後，如果你有你想有按鈕一定的寬度，添加寬度，然後你可以從你的代碼中使用自動利潤率。

.home_contact_btn a{ 
    display:block; 
    text-align:center; 
    width:50%; 
    margin:0 auto; 
} 

Answer 2

設置爲父容器text-align：center;

@media (max-width:700px){ 
.wpb_wrapper{ 
    text-align:center; 

} 
.home_contact_btn a{ 
    text-align:center; 
} 
} 

fiddle

Answer 3

只需使用這樣的：或者

.home_contact_btn a{ 
display : block; 
text-align : center; 
margin : 0 auto; 
} 

，使用此：

.wpb_wrapper { 
text-align : center; 
} 

他們兩人的作品，但我會選擇第一種方法推薦您因爲在第二種選擇所有主播（<a> elemen ts）將居中。

如果您的「取得聯繫」按鈕的父元素中沒有任何其他錨，則第二個選項也將按預期工作。