在移动网站

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）将居中。

如果您的“取得联系”按钮的父元素中没有任何其他锚，则第二个选项也将按预期工作。