Question

我遇到两种按钮问题。它基本上是一个表单按钮和一个css按钮。我被告知css按钮应该使用display：inline-block; 这使整个href标签实际上看起来像一个按钮。但这种看不见的边缘似乎搞砸了什么。我尝试将它们分成单独的css类，但奇怪的是，在css按钮上应用真正的边距也会产生额外的余量。造成这种情况的原因是什么？

你可以在这里轻松看到它（低图形）： www.matkalenderen.no

基本上，代码如下所示：

      <input type="submit" value="Logg inn" class="button_blue" alt="ready to login"> 
      <a class="button_css_red" href="access.php">Glemt passord</a>

CSS

.button_red, .button_blue, .button_css_red, .button_css_blue {
    background-image:url("../img/sprite_buttons.png");
    background-repeat:no-repeat;
    border: none;
    color:#FFFFFF;
    display:inline-block;
    display:inline-block;
    font-size:12px;
    height:27px;
    width:98px;
}

.button_css_red, .button_css_blue {
    margin-top:20px;
}

Answer 1

我自己找到答案：）

看起来我能够通过应用大约31像素的行高来修复它。

CSS - 为什么这个隐形边距应用于我的<a> tag css-button?</a>

1 个答案: