Teil der Fußzeile wird versteckt

Question

Ich arbeite an einer Entwicklung einer Website für meine Firma. Ich habe ein Problem, bei dem das Layout nicht richtig funktioniert. Die Fußzeile unten ist teilweise bedeckt. Ich habe einen Z-Index hinzugefügt und es hat nichts verändert. Ich habe mit Rändern und Polsterungen vergeblich gespielt. Hoffentlich kann jemand sehen, was ihn teilweise bedeckt. Hier zeigt ein Bild, was ich sehe:

und die Website ist hier: 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

Es hat eigentlich nichts mit deinem CSS zu tun, da @Bart mir geholfen hat, es zu bemerken.

um Zeile 200 (Ihres HTML) haben Sie dies;

<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> 
> 

, wie Sie nach dem Abschluss Script-Tag sehen kann, gibt es eine Streu >, die die Ursache Ihrer Probleme ist.

Auch sollte margin: 0 auto -20px; sein margin: 0 auto; als @Tezekiel sagte

Answer 2

Entfernen Sie einfach diesen

margin: 0 auto -20px; 

aus der Fußzeile CSS .