0
나는 반응 형 바닥 글을 작성 중이므로 모든 것을 작동시킬 수있었습니다. 레이아웃은 작은 문제가있는 곳입니다. 각 li 필드 다음에 바닥 경계선을 가져올 수 없으며 마지막에 아이콘을 얻을 수 없습니다. 이것은 내가 지금까지 해왔 던 것이다. 친절하게도 제가 빠진 것을 알려주십시오. 아래쪽 테두리와 아이콘을 내 바닥 글에 추가하십시오.
나는 곳의 모든 기능이
@media all and (max-width: 979px) {
.brand-logos{
\t margin: 0 auto !important;
\t padding: 10px !important;
}
footer nav ul{
display:block !important;
margin: 0 auto !important;
}
footer nav ul li{
display:inline-block;
margin: 0 auto !important;
padding: 0 !important;
}
footer nav ul li img{
margin: 20px auto !important;
width: 70% !important;
display: block !important;
}
footer .footer-navigation .container-inline-css{
\t width: 100% !important;
\t padding:10px !important;
\t margin:0 !important;
\t border-bottom: 1px solid #77777A !important;
}
footer .footer-navigation .container-inline-css span{
\t margin: 0 !important;
padding: 0px !important;
cursor: pointer !important;
}
footer .footer-navigation div.container-inline-css ul{
\t max-height: 0 !important;
overflow: hidden !important;
padding: 0 20px !important;
}
footer .footer-navigation div.container-inline-css.active ul{
\t max-height: 10000px !important;
}
}
<div class="footer-navigation">
\t <div class="container-inline-css">
\t \t <span class="koh-nav-section-title footer-link-title-text">
<span>CONTACT INFO</span>
\t \t </span>
\t \t <ul class="koh-nav-section-items footer-link-items-text">
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t <span class="icon-bg icon-phone"> </span>Call 1-800-STERLING</a>
\t \t \t </li>
\t \t \t <li><a href="/contact-us" target="_self">
\t \t \t \t \t \t \t \t \t \t <span class="icon-bg icon-contact"></span> Contact Us</a>
\t \t \t </li>
\t \t </ul>
\t </div>
\t <div class="container-inline-css">
\t \t <span class="koh-nav-section-title footer-link-title-text">
<span>OUR COMPANY</span>
\t \t </span>
\t \t <ul class="koh-nav-section-items footer-link-items-text">
\t \t \t <li><a href="http://www.annsacks.com/" target="_blank">
\t \t \t \t \t \t \t \t \t \t About Us</a>
\t \t \t </li>
\t \t \t <li><a href="http://www.kallista.com/home.kls" target="_blank">
\t \t \t \t \t \t \t \t \t \t E-Newsletter Sign Up</a>
\t \t \t </li>
\t \t \t <li><a href="http://www.robern.com/home.rbn" target="_blank">
\t \t \t \t \t \t \t \t \t \t Careers</a>
\t \t \t </li>
\t \t \t <li><a href="/press-releases" target="_self">
\t \t \t \t \t \t \t \t \t \t Press Room</a>
\t \t \t </li>
\t \t \t <li><a href="http://www.kohler.com/corporate/index.html" target="_blank">
\t \t \t \t \t \t \t \t \t \t Kohler Co.</a>
\t \t \t </li>
\t \t </ul>
\t </div>
\t <div class="container-inline-css">
\t \t <span class="koh-nav-section-title footer-link-title-text">
<span>RESOURCES</span>
\t \t </span>
\t \t <ul class="koh-nav-section-items footer-link-items-text">
\t \t \t <li><a href="/litrature" target="_self">
\t \t \t \t \t \t \t \t \t \t Literature</a>
\t \t \t </li>
\t \t \t <li><a href="https://www.youtube.com/channel/UCMMnMReFTMuI9bpoctNGPkw/videos" target="_blank">
\t \t \t \t \t \t \t \t \t \t Merchandise</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t FAQs</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t Glossary</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t Tech Documents</a>
\t \t \t </li>
\t \t </ul>
\t </div>
\t <div class="container-inline-css">
\t \t <span class="koh-nav-section-title footer-link-title-text">
<span>CUSTOMER CARE</span>
\t \t </span>
\t \t <ul class="koh-nav-section-items footer-link-items-text">
\t \t \t <li><a href="/cad-symbols" target="_self">
\t \t \t \t \t \t \t \t \t \t Track Your Order</a>
\t \t \t </li>
\t \t \t <li><a href="http://www.inspiracionkohler.com/" target="_blank">
\t \t \t \t \t \t \t \t \t \t Care & Cleaning</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t Warranties</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t Videos</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t Product Registration</a>
\t \t \t </li>
\t \t </ul>
\t </div>
\t <div class="container-inline-css">
\t \t <span class="koh-nav-section-title footer-link-title-text">
<span>SOCIAL</span>
\t \t </span>
\t \t <ul class="koh-nav-section-items footer-link-items-text">
\t \t \t <li><a href="https://www.facebook.com/kohlermexico" target="_blank">
\t \t \t \t \t \t \t \t \t \t <span class="icon-bg icon-social-facebook"></span>Facebook</a>
\t \t \t </li>
\t \t \t <li><a href="https://www.instagram.com/kohlerco/?hl=en" target="_blank">
\t \t \t \t \t \t \t \t \t \t <span class="icon-bg icon-social-instagram"></span>Instagram</a>
\t \t \t </li>
\t \t \t <li><a href="https://www.youtube.com/user/kohler" target="_blank">
\t \t \t \t \t \t \t \t \t \t <span class="icon-bg icon-social-pinterest"></span>Pinterest</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t <span class="icon-bg icon-social-youtube "></span>YouTube</a>
\t \t \t </li>
\t \t \t <li><a href="null" target="_blank">
\t \t \t \t \t \t \t \t \t \t <span class="icon-bg icon-social-houzz"></span> Houzz</a>
\t \t \t </li>
\t \t </ul>
\t </div>
</div>
는 리튬 요소의 아래쪽 테두리 또한 끝의 화살표 아이콘을 기대합니다. 어떤 도움을 주셔서 감사합니다.