Question

我的页面上有一个号召性用语按钮，我试图稍微向右移动，以便更好地与页面上方的文本/图像对齐。我尝试的所有东西要么将它移到其他元素之后，要么根本不做任何事情。任何提示/技巧/解决方案都会很棒。 CSS列在下面。感谢。

        .cta-button {
    margin: 10px auto;
    clear: both;
    float: none !important;
    padding-left:30px;
    height: auto !important;
}
            .cta-on-phone-alignment { text-align: center !important; clear: both     !important; height: 70px; 0 0 0; vertical-align: baseline !important; }
             img.hero {
    clear: inherit !important;
    margin: 0 auto !important;
    text-align: center !important;
    float: none !important;
}

按钮所在的HTML。如果需要更多，请告诉我。我对网页设计有点新意，这对我来说仍然很困惑。

<div class="row cta-on-phone-alignment">
                            <!-- Button links to bottom of page -->
                            <a href="#bottom" class="cta-button" style="text-align:center !important;">Contact Us</a> <!-- Call To Action Button -->
                        </div>

Answer 1

要确保按钮位于堆栈的前面，您需要使用z-index AND定位。

试

.cta-button {
  margin: 10px auto;
  clear: both;
  float: none !important;
  padding-left:30px;
  height: auto !important;

  position: relative;
  z-index: 1000;
}

如果您也可以发布HTML，那将会有很大帮助！

移动CTA按钮

1 个答案: