0

これらの余分なスペースを下と下から削除したい:

結果はIEとクロムで異なり、クロムには両方のスペースがあり、IEには下部にスペースがありません。

私が間違っていることを教えてもらえますか？「表示」cssと何か関係があるのでしょうか？

jsfiddle

スクリーンショット Chrome: http://i.imgur.com/S8xtZBm.png

スクリーンショット IE: http://i.imgur.com/Uoqfo2R.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;
}

ありがとう ！

4

3 に答える 3

2

リンクの下のスペースを削除するには、クラスに追加vertical-align:top;します.tb-btn-s。リンクの横にあるスペースを削除するには、コード内の空白を削除します。

jsFiddle の例

于 2013-06-14T13:26:10.687 に答える
0

float:left;.tb-btn-s を追加するだけです

jsFiddle ファイル

于 2013-06-14T13:28:02.253 に答える
-1

横の余白は inline-block のため 下の余白は lineheight のため

これを親に追加できます

word-spacing:-4px;

そして、「a」でリセットして、インラインブロックからマージンを削除します

word-spacing:0;

また、行の高さを削除します

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

于 2013-06-14T13:27:36.833 に答える