如何在div内水平居中span元素
如何在div内水平居中span元素
提问于 2018-04-23 09:45:50
我试图将两个链接的“查看网站”和“查看项目”集中在周围的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
}
回答 2
Stack Overflow用户
发布于 2018-04-23 18:25:55
一种选择是给出<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
}
Stack Overflow用户
发布于 2018-04-23 19:03:26
另一种选择是给予跨度display:table;并将其居中margin:0 auto;
span {
display:table;
margin:0 auto;
}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/-100003959
复制相关文章
相似问题