media - 如何设置水平排列的按钮之间的距离

Question

我想显示两个按钮，FB 和 Twitter，并排，水平对齐，但是，它们之间的空间太大。我应该如何保持两个按钮之间的距离最小？这是网站（HELLO WORD 下的 FB 和 Twitter 按钮）http://blog.michelleaneous.com

这是我当前的 CSS 代码：

.content_area2 .share{

display:inline; 
width:170px;

}

.content_area2 .share ul{

}

.content_area2 .share ul li{

float:left;
display:inline; 
margin-left: 300px;

}

Answer 1

您在“.conent_area2 .share ul li”上有“margin-left:300” - 这就是它们之间的距离。你能发布一个你想要的模拟（ png ）吗，我会给你 HTML 吗？

我的猜测是你的意思是把margin-left放在“.content_area2 .share ul”上。

如果你想在 CSS 中居中一个对象，你应该使用{ margin-left:auto; margin-right:auto }

整个CSS如下：

.content_area2 .share {
   width:200px;
   margin-left:auto;
   margin-right:auto;
}
.content_area2 .share ul li {
  float:left;
}

有用。

这是我的在线工作副本

Answer 2

使用这些样式。调整边距以设置距离。例如：2ex 或 10px。在每一侧。

.content_area2 .share {
  display: inherit;
  width: inherit;
  text-align: center;
}
.content_area2 .share ul li {
  float: inherit!important;
  margin: 0 1ex!important;
}