css – 如何在span内水平居中span元素

前端之家收集整理的这篇文章主要介绍了css – 如何在span内水平居中span元素前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图将两个链接的视图网站和’查看项目’在周围的div。有人能指出我需要做什么才能使这项工作?

JS小提琴:http://jsfiddle.net/F6R9C/

HTML

<div>
  <span>
    <a href="#" target="_blank">Visit website</a>
    <a href="#">View project</a>
  </span>
</div>

CSS

div { background:red;overflow:hidden }

span a {
    background:#222;
    color:#fff;
    display:block;
    float:left;
    margin:10px 10px 0 0;
    padding:5px 10px
}

解决方法

一个选择是给予< a>显示inline-block然后应用text-align:center;在包含块(也删除浮动):
div { 
    background:red;
    overflow:hidden 
    text-align: center;
}

span a {
    background:#222;
    color:#fff;
    display: inline-block;
    /* float:left;  remove*/
    margin:10px 10px 0 0;
    padding:5px 10px
}

http://jsfiddle.net/Adrift/cePe3/

原文链接:https://www.f2er.com/css/223118.html

猜你在找的CSS相关文章