頁腳移動較大的屏幕

Question

我遇到了一個問題，我的頁腳。

它在正常的屏幕尺寸，平板電腦和手機上看起來很棒，但對於屏幕較大或分辨率較高的人來說，頁腳一直走到左側。

查看屏幕在這裏拍攝的大屏幕：http://www.bkd.com/images/bkd-big-screen.png

這是實際的頁面網址：http://www.bkd.com/new-test-2.htm

我需要頁腳留在頂部的經驗BKD標誌一字排開。這裏是一個正常大小的屏幕上如何我想它一刀切：http://www.bkd.com/images/bkd-normal-screen.png

這裏是頁腳編碼：

<div id="footer3"> 

    <div id="footer3-contents"> 
    <div class="span-6"> 
    <a href="https://www.facebook.com/BKDcpasandadvisors?ref=ts"><img width="23" height="25 alt="BKD Facebook" src="/images/icons/social-media/facebook-icon.png"></a> 
    <a href="https://www.linkedin.com/company/bkd-cpas-&-advisors?trk=biz-companies-cym"><img width="25" height="25" alt="BKD LinkedIn" src="/images/icons/social-media/linkedin-icon.png" id="icons"></a> 
    <a href="https://twitter.com/bkdllp"><img width="25" height="25" alt="BKD Twitter" src="/images/icons/social-media/twitter-icon.png" id="icons"></a> 

    <a href="https://www.youtube.com/user/experienceBKD"><img width="25" height="25" alt="BKD Youtube"src="/images/icons/social-media/youtube-icon.png" id="icons"></a> 
    <a href="https://plus.google.com/+BkdCPAsandadvisors/posts"><img width="25" height="25" alt="BKD Google Plus" src="/images/icons/social-media/google-icon.png"></a> 



    </div> 
    <div id="footer-legal" class="span-18 last"> 

    <ul> 
    <li><a href="/contact-us/">Contact Us</a></li> 
    <li><a href="/about-us/terms-of-use.htm">Terms of Use</a></li> 
    <li> <a href="/about-us/privacy-policy.htm">Privacy Policy</a></li> 
    <li> <a href="/about-us/disclosures.htm">Disclosures</a></li> 
    <li> <a href="http://ultipro.bkd.com/">UltiPro</a></li> 
    <li style="color:#fff">Copyright © 2014 BKD, LLP.</li> 


    </ul> 
    <a href="/about-us/praxity/"><img src="/images/praxity-white.png" width="101" height="47"></a> 
    </div><div class="clear"></div> 
    <div class="clear"></div></div></div><!--end footer --> 




    </body> 
    </html> 

CSS：

/*footer */ 
    #footer3 {padding:36px 0px; background: url(/images/common/footer/footer-black.png); background-repeat:text-align:left; width: auto; font-size:14px; font-weight:normal;} 
    #footer3-contents { margin:10px; width: auto; padding-left: 95px;} 
    #footer3 h2 { color:#fff; font-size:12px; padding-left:0px; } 
    #footer3 h2 a { color:#fff; } 
    #footer3 a { color:#fff; } 
    #footer3 #footer-legal ul { padding: 0px; margin:0px 0px 0px 0px;} 
    #footer3 #footer-legal ul li {float:left; padding: 10px 10px 2px 0px;} 
    #icons {padding-right:4px;} 

預先感謝您您的幫助。

Answer 1

#footer3-contents { 
    margin: 0 auto; 
    width: 1000px; 
} 

將＃footer3內容更改爲上述內容，它將起作用。

發生此問題的原因是因爲您所做的只是在原始代碼中將頁腳壓入95px。您需要做的是爲頁腳內容設置一個定義的寬度，然後將每邊的邊距設置爲相等。

如果兩邊的邊距相等，則div將出現在網頁的中心。

Answer 2

以％爲單位提供保證金值，而不是px。