无论我尝试什么，为什么我的按钮不会向上移动？

Question

我试图向上移动我的后退按钮，但不管我做什么，它都不起作用。

例如

• 如果我做margin-bottom: 29%;，那么Button One和Button Two向下移动，而back按钮保持不动并且不动。
• 如果我做margin-top: 29%;，那么Button One和Button Two随着back按钮向下移动。
• 如果我做top: 29%，back按钮保持不动并且不动。

如何让我的back按钮向上移动？

（如果您需要更多代码或需要我清理一些内容，请告诉我们）

.BackButton {
    border: 5px solid #401818;
    background: #a265d4;
    background: -webkit-gradient(linear, left top, left bottom, from(#65d672), to(#a265d4));
    background: -webkit-linear-gradient(top, #65d672, #a265d4);
    background: -moz-linear-gradient(top, #65d672, #a265d4);
    background: -ms-linear-gradient(top, #65d672, #a265d4);
    background: -o-linear-gradient(top, #65d672, #a265d4);
    background-image: -ms-linear-gradient(top, #65d672 0%, #a265d4 100%);
    padding: 12px 8px;
    padding-right: 23px 46px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
    -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
    box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
    text-shadow: #bd7f7f 0 1px 0;
    color: #066b6b;
    font-size: 24px;
    font-family: helvetica, serif;
    text-decoration: none;
    vertical-align: middle;
}

Answer 1

您可以使用位置，例如：

.BackButton {
  postition: fixed; //can also use absolute
  left: 0;
  top: 0;
 }

够了，你可以从那里做。

Answer 2

您可以在后退按钮上尝试此操作，因为这会拉动您的元素而不是添加它。

margin-top: -29%;

除了清洁解决方案之外，它更像是一种技巧。我实际上建议将你的后退按钮按顺序放在DOM中，因为它打算显示，然后更改标题问题（h1 / h2 / h3）以显示：inline-block并为其添加填充用于使文本正确居中的后退按钮的大小。如果您使用这个技巧，最终可能会在某些分辨率和浏览器中显示一个覆盖标题的按钮。