<分区>
Possible Duplicate:
Unwanted margin in inline-block list items
How to remove “Invisible space” from HTML
我有一个 <ul>多个<li> children 。
li只包含一个图像，我删除了它们的所有边距。
我也调用display:inline-block;在它们上面，所以它们现在显示在一行中。
但是li的右边还是有一点余量的秒。
我发现这是换行符，如果我删除它，边距就会消失。
但是，如果我必须删除所有换行符，它就很难读了。
你能给我一个解决方案吗？
HTML
<ul>
<li><a href="#"><img src="image1.png" alt="post_heart" /></a></li>
<li><a href="#"><img src="image2.png" alt="post_repeat" /></a></li>
<li><a href="#"><img src="image3.png" alt="post_tag" /></a></li>
<li><a href="#"><img src="image4.png" alt="post_share" /></a></li>
</ul>
少
ul {
display:inline;
padding:none;
margin:none;
li {
display:inline-block;
padding:none;
margin:none;
a {
display:block;
margin:none;
border-right: 1px solid #e0e1e2;
&:hover {
.linearGradient(transparent, rgba(0,0,0,0.05));
}
}
&:last-child {
a {
border:none;
}
}
}
}