바닥 글 아래 빈 공백을 제거하는 방법은 무엇입니까?

Question

나는 대답 한 질문에 따라 공백을 제거하려고했습니다. 그러나 그들 중 누구도 내 편이 아니다.

div의 바닥 글에서 패딩을 제거하려고했으나 여전히 공백이 남아 있습니다.

해결 방법?

CSS :

footer #bottom-footer{ background: url(/files/bg-testimonials.jpg) no-repeat; background-repeat: no-repeat; background-size: cover; box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.52); color: #000; text-align: left; padding: 50px 0 50px 0; font-size: 0.8125em; font-family: 'Open Sans', sans-serif; font-weight: 600; letter-spacing: normal; position: relative; left: 0; bottom: 0; height: auto; width: 100%; } 
.footer-wrap a{ color: #000; } 
.footer-wrap a:hover{ color: #d31716; } 
.footer-logo a{ margin-bottom: 6px; display: block; } 
.footer-socials{ float: none; line-height: 0; text-align: center; padding: 1em 0 2em;} 
.footer-socials a{ border-radius: 100%; border: 3px solid #FFF; color: #FFF; display: inline-block; font-size: 1.25em; line-height: 2.50em; margin-left: 0.1em; text-align: center; vertical-align: middle; width: 2.50em; height: 2.50em; } 
.footer-socials .social-icons span{ cursor: pointer; display: inline-block; } 
.footer-socials .socials i{ -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; } 
.tagcloud a{ font-size: 13px !important; background: rgba(0,0,0,0.4); padding: 8px 10px; margin: 0 2px 4px 0; display: inline-block; line-height: 1; } 
.sidebar .tagcloud a{ background: #23A38F; color: #FFF; } 
.bottom-menu{ float: right; margin: 1em 4em 0 0; } 
.bottom-menu ul{ list-style-type: none; font-size: 1.1125em; } 
.bottom-menu ul li{ display: inline-block; font-family: 'Open Sans', sans-serif; font-weight: normal; line-height: 1.8; border-radius: 5px; border: 1px solid #CCC; box-shadow: 0 0 2px rgba(0,0,0,0.3); padding: 1em; margin: 0 0.10em 0 0; background: #FFF; color: #3e3e3e; } 
.footerimg{ width:6em; } 
.copyright{ margin: 2em 0 0 4em; } 
.copyrighttext{ font-size: 1.08em; font-weight: 600; color: #B3B3B3; margin: 0 0 0 0.50em; } 
#imgv ul{ list-style-type: none; letter-spacing: 1px; margin-top: -20px; font-size: 0.75em; } 
#imgv ul li{ display: inline; } 
.social-footer-mobile{ display: none; } 
.footer-vertical-line{ border-top: 1px solid #8c8b8b;width: 9em; vertical-align: middle; position: relative; } 
.left{ left: 32.50em; top: 1.65em; } 
.right{ right: 32.50em; top: -1.45em; float: right; } 

HTML :

<div id="bottom-footer" class="footer-menu"> 
    <div class="ak-container"> 
    <div class="footer-wrap clearfix"> 
     <div class="footer-socials clearfix"> 
     <div class="footer-vertical-line left"></div> 
      <div class="socials"> 
     <a href="#" class="facebook" title="Facebook" target="_blank"><span class="font-icon-social-facebook"></span></a> 
     <a href="#" class="twitter" title="Twitter" target="_blank"><span class="font-icon-social-twitter"></span></a> 
     <a href="#" class="youtube" title="Youtube" target="_blank"><span class="font-icon-social-youtube"></span></a> 
     <a href="" class="linkedin" title="Linkedin" target="_blank"><span class="font-icon-social-linkedin"></span></a> 
     </div> 
       <div class="footer-vertical-line right"></div> 
     </div> 

     <div class="footer-columns-4"> 
      <ul> 
       <li>Products</li> 
       <li><a href="#" title="All Products">All products</a></li> 
       <li><a href="#" title="Standard loan">Standard loan</a></li> 
       <li><a href="#" title="Promo loans">Promo loans</a></li> 
       <li><a href="#" title="Promo loans">Insurance for loans</a></li> 
      </ul> 
      <ul> 
       <li>About Loans</li> 
       <li><a href="#" title="How to apply">How to apply</a></li> 
       <li><a href="#" title="Our partner stores">Our partner stores</a></li> 
       <li><a href="#" title="Terms &amp; Conditions">Terms &amp; Conditions</a></li> 
       <li><a href="#" title="Safety guarantee">Safety guarantee</a></li> 
      </ul> 
      <ul> 
       <li>For Customers</li> 
       <li><a href="#" title="Financial literacy">Financial literacy</a></li> 
       <li><a href="#" title="Payments &amp; Guidelines">Payments &amp; Guidelines</a></li> 
       <li><a href="#" title="Menu">Menu</a></li> 
       <li><a href="#" title="FAQ">FAQ</a></li> 
      </ul> 
      <ul> 
       <li>Title</li> 
       <li><a href="#" title="About us">About us</a></li> 
       <li><a href="#" title="News">News</a></li> 
       <li><a href="#" title="Careers">Careers</a></li> 
       <li><a href="#" title="Contacts">Contacts</a></li> 
      </ul> 
     </div> 

     <nav role="navigation"> 
     <div class="bottom-menu"> 
      <ul class="footer-desktop-version"> 
       <li><span class="footer-icon-cs icon-icon-support"></span>Customer Service: <strong>11111111</strong></li> 
      <li><span class="footer-icon-cs icon-icon-collection"></span>Collections <strong>1111111</strong></li> 
      </ul> 
     </div> 
     </nav> 

     <div class="copyright"> 
     <img src="/files/footer.jpg" class="footerimg"><span class="copyrighttext"> All Rights Reserved ® 2017 
      Company Name</span> 
     </div><!-- .copyright --> 
    </div><!-- .footer-wrap --> 
        </div> 
     </div> 

Answer 1

코드에 아무 것도 표시되지 않고 웹 주소를 공개 할 수 없습니다. 당신은 당신이 margin-top:-100px

Answer 2

1. 먼저는
2. 을 검사 당신이 볼 바닥 글을 클릭 오른쪽 클릭해야 모든 해당 특정 요소에 적용된 CSS, 상위 엘을 선택하십시오. e
3. 바닥 글이 본문 또는 바닥 글 요소에 적용되는지 확인
4. 바닥 글 또는 본문 요소 또는 다른 부모 클래스의 바닥 글에 바닥 글을 음수로 지정하면 찾을 수 없습니다. (예 : -5px)

참고 : 당신은 당신이 변경 및 디버깅 도구 자체 (디버깅 도구 F12 바로 가기)

뭔가해야의 효과를 확인할 수 있습니다 테스트 목적으로 직접 CSS를 수정할 필요가없는 like : (요소 이름) {패딩 하단 : -30px); }

패딩이 작동하지 않으면 아래쪽 여백도 확인하십시오.