一类，宽度问题。高度和边距

Question

我正在尝试在不使用 CSS3“按钮”的情况下创建按钮。浮动、高度和宽度不起作用。

a.reply {
    padding: 20px;
    background-color: #555;
    border-radius: 4px;
    margin-top: 10px;
    width: 100px;
    height: 50px;
}

a:hover.reply {
    padding: 20px;
    background-color: #fff;
    border-radius: 4px;
    width: 100px;
    height: 50px;
}

Answer 1

使用内联块

a.reply {
display: inline-block;
padding: 20px;
background-color: #555;
border-radius: 4px;
margin-top: 10px;
width: 100px;
height: 50px;
}

Answer 2

width、height、margin 只能作用于有维度的元素，也就是块级元素。

因此您需要将display: block 或display: inline-block 属性添加到您的<a>

要将它们彼此相邻，您可以做两件事：（请注意，我在您的代码中修复了一些 CSS 问题）

浮点数：

<p class="clearfix">
  <a href="#" class="reply">foo</a>
  <a href="#" class="reply">bar</a>
</p>

CSS：

.clearfix:after {
  content: "";
  display: block;
  height: 0;
  clear: both; 
  visibility: hidden;
}

a.reply {
    padding: 20px;
    background-color: #555;
    border-radius: 4px;
    margin-top: 10px;
    width: 100px;
    height: 50px;
    margin-right: 15px;
    float: left;
}

a.reply:hover {
    background-color: #fff;
}

显示内联块

<p>
  <a href="#" class="reply">foo</a>
  <a href="#" class="reply">bar</a>
</p>

CSS：

a.reply {
  padding: 20px;
  background-color: #555;
  border-radius: 4px;
  margin-top: 10px;
  width: 100px;
  height: 50px;
  display: inline-block;
  margin-right: 15px;
}

a.reply:hover {
  background-color: #fff;
}

Answer 3

问题可能出在您的 HTML 中，请确保它看起来像这样：

<a class="reply">yes</a>
<a class="reply">yes</a>

似乎工作正常： http://jsfiddle.net/a6EQk/1/

另外，<a> 元素通常需要设置为显示：block 或 inline-block 以具有任何尺寸。
默认情况下，<a> 元素设置为 display:inline;。
你可能想看看这个解释：display:inline vs display:block

另外，我在您的 css 中没有看到对 float 的引用。如果您确实使用浮动，请确保正确清除它们。