Question

我想从下方向下和向下移除这些额外的间距：

IE和Chrome的结果不同，chrome有两个间距，IE底部没有间距。

你能指导我做错了什么吗？也许与“显示”css有关？

屏幕截图Chrome： http://i.imgur.com/S8xtZBm.png

代码：

<footer>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
<a class="tb-btn-s" style="color: #fff; background-color: #0064a9" href="/services/">service</a>
    </footer>

的CSS：

.tb-btn-s {
    zoom: 1;
    z-index: 1;
    font-size: 14px;
    line-height: 5px;
    min-width: 42px;
    text-decoration: none;
    white-space: nowrap;
    vertical-align: inherit;
    position: relative;
    display: inline-block;
    overflow: visible;
    margin: 0;
    padding: 8px 10px;
    cursor: pointer;
    outline: 0;
    border: 0;
    text-align: left;
    padding-right: 30px;
    min-width: 60px;
}
footer
{
    background-color: red;
}

谢谢！

Answer 1

要删除链接下方的空格，请将vertical-align:top;添加到.tb-btn-s课程。要删除链接旁边的空格，请删除代码中的空格。

<强> jsFiddle example

Answer 2

只需在.tb-btn-s

中添加float:left;即可

jsFiddle File

Answer 3

边缘是由于内联块底部边缘是因为线高

您可以将其添加到父

word-spacing:-4px;

并在“a”上重置它以从内联块中删除边距

word-spacing:0;

同时删除你的行高

http://jsfiddle.net/nyaFz/5/

从锚点中删除多余的线条

3 个答案: