css - 如何使自定义 css 按钮响应？

Question

我创建了一个 CSS 按钮，但它没有响应。我已经尝试添加 EM 或 % 但仍然无法正常工作。我想根据屏幕分辨率更改<​​em>宽度和高度。

以下是我实际使用的 CSS 代码:

@media only screen and (min-width:321px) and (max-width:480px) { }

HTML

<div>
   <p>
      <button class="btn btn-1 btn-1a">Click Here To Enter The Future</button> 
   </p>
</div>

CSS

.btn {
  font-size:0.875em;
  display:block;
  left:-60px;
  margin-top:35px;
}

现在按钮从左向右移动，但我希望按钮出现在完全相同的位置。

Answer 1

您可以添加 width:100%; 来实现您的目标。

.btn {
      font-size:0.875em;
      display:block;
      left:-60px;
      margin-top:35px;
      width:100%;
    }