Question

正如标题所示，我有一个<button>标签，其中包含CSS显示：block;哪个应该自动使元素跨越容器的宽度？我在页面上有其他按钮，但它们是<a>标记，但与<button>标记具有相同的css类。

可以在此处找到网站：http://www.cqwebdesign.co.uk/stirlinggrey/，因为您可以将每个部分视为底部的按钮链接。然而，任务中的一个位于标题部分页面的底部：＆＃34;收到您的免费指南和报价＆＃34;

Codepen版本：http://codepen.io/anon/pen/zoOQQL

HTML：

<a href="#" class="btn">This is a button</a>
<button class="btn">This is a button</button>

CSS：

.btn {
  font-size: 16px;
  font-family: Open Sans;
  color: #fff;
  border: 0;
  background: #000;
  padding: 10px;
  text-decoration: none;
  text-transform: uppercase;
  line-height: 1.5;
  display: block;
  margin-bottom: 10px;
}

由于

Answer 1

如果您的问题是按钮需要居中，您需要明确：两者;为了使其免受上述浮动元素的影响。

块级元素占据整个宽度，但不会影响元素本身的宽度。使用宽度：;标记来改变它。

希望这会有所帮助：）

<button>无法使用display：block;

1 个答案: