css - 部分页脚被隐藏

Question

我正在为我的公司开发网站。我被困在一个布局无法正常工作的问题上。底部的页脚被部分覆盖。我添加了一个 z-index，但它没有任何改变。我玩过边距和填充无济于事。希望有人能看到是什么导致它被部分覆盖。 这是一张显示我所看到的图像:

网站在这里:http://clubschoicemagic.com/

#slide03.slide .footer-container {
  background-color: #06060d;
  color: rgba(255, 255, 255, 0.5);
  font-size: 14px;
  margin-bottom: 0;
  text-align: center;
}
#slide03.slide .footer-container .wrapper {
  background-color: #06060d;
  bottom: 0;
  color: #ffffff;
  left: 0;
  margin: 0 auto -20px;
  padding-top: 5px;
  position: absolute;
  text-align: center;
  text-shadow: none;
  top: auto;
  transform: none;
  width: 100%;
}

<div class="footer-container">
  <footer class="wrapper">
    <img src="http://clubschoicefundraising.com/Content/img/logo.png" class="center-block" width="80" />
    <h3>
                    Clubschoicemagic.com is affiliated with <a href="http://clubschoicefundraising.com">Club's Choice Fundraising</a>.
                </h3>
  </footer>
</div>

Answer 1

@Bart 帮助我注意到，这实际上与您的 CSS 无关。

在(您的 HTML 的)第 200 行左右，您有这个；

    <script type="text/javascript">

        $(document).ready(function () {
            $(".contactForm").on('submit', function (e) {
                e.preventDefault();
                var firstName = $("#firstName").val();
                if (firstName == "") {
                    firstName = "None given";
                }
                var model = { firstName: firstName, schoolName: $("#schoolName").val(), note: $("#note").val() };

                $.ajax({
                    url: "/Home/Index",
                    type: 'POST',
                    data: { model: model },
                    success: function (result) {
                        if (result) {
                            $(".contactForm").trigger('reset');
                            $("#formMessage").html("Thank you.  Your entry has been submitted.");
                        }
                    },
                    error: function (xhr, ajaxOptions, thrownError) {

                    }
                });

            });
        });
    </script>
>

如您所见，在关闭脚本标记之后有一个杂散的 > 是您出现问题的原因。

还有 margin: 0 auto -20px; 应该是 margin: 0 auto; 正如@Tezekiel 所说