如何居中我的页脚

时间:2015-06-09 13:53:28

标签: html css

我的页脚需要居中,但它不会。 我使用了Puremedia的模板并更改了一些内容,但我感到茫然,需要尽快修复。

我的页脚现在看起来像这样:

http://tinypic.com/r/e0hdgi/8

页脚需要像这样向左推:

http://tinypic.com/r/2lu2qu0/8

这是我的代码。



/* i. Footer Styles
/* =================================================================== */
footer {
	padding-top: 36px;
	padding-bottom: 42px;
	font-size: 13px;
	line-height: 24px;
	color: #3C4142;	
}

footer a, footer a:visited {
	color: #a43b0a;
}
footer a:hover, footer a:focus {
	color: white;
}
footer h3 {
	font: 13px/24px "raleway-bold", sans-serif;
	margin-bottom: 0;
	color: white;
	text-transform: uppercase;
	letter-spacing: 1px;
}
footer p {
	margin: 12px 0;
}

footer .footer-about {
	padding-right: 60px;
}
footer .right-cols .columns {
	width: 50%;
	word-wrap: break-word;
}
footer ul {
	margin: 12px 0;
	padding: 0;
	list-style: none;
}
footer ul li {
	margin: 0;
	padding-left: 0;
	line-height: 24px;
}
footer ul li a, footer ul li a:visited {
	color: #3C4142;
}
footer .copyright {
	margin: 0;
	padding: 24px 18px 6px 18px;
	clear: both;
}

/* back to top */
footer #go-top {
	position: fixed;
	bottom: 0;
	right: 30px;
	z-index: 900;
	display: none;
}
footer #go-top a {
	display: block;
	padding: 12px 30px;
	background: #d44d0d;
	color: white;
	text-align: center;
	font: 12px/24px "raleway-heavy", sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
footer #go-top a span {
	margin-right: 10px;
}
footer #go-top a:hover {
	background: #faec09;
	color: #252525;
}

 <!-- Footer
   ================================================== -->
 <footer>
      <div class="row">       
         <div class="six columns tab-whole footer-about">            
        <h3>Site Map</h3>
               <!--Links on the NAV-->
        <li><a href="index.html">HOME</a></li>
        <li><a href="register.html">REGISTRATION</a></li>
        <li><a href="audition.html">AUDITION</a></li>
        <li><a href="contact.html">CONTACT</a></li>
        <li><a href="credits.html">CREDITS</a></li>                                                   
         </div> 

         <div class="six columns tab-whole right-cols">

            <div class="row">

               <div class="columns">
                  <h3>TAB 2</h3>                      
                  <ul>
                    <li><a href="http://www.ncmea.net">NCMEA</a></li>
                    <li><a href="">123.456.7890</a></li>
                    <li><a href="mailto:someone@puremedia.com">someone@puremedia.com</a></li>
                  </ul>                  
               </div> <!-- /columns -->             
               <div class="columns last">
                  <h3 class="contact">TAB 3</h3>
                  <ul>
                     <li><a href="#crash">Link 1</a></li>
                     <li><a href="#crash">Link 2</a></li>
                     <li><a href="#crash">Link 3</a></li>
                     <li><a href="#crash">Link 4</a></li>
                     <li><a href="#crash">Link 5</a></li>
                     <li><a href="#crash">Link 6</a></li>
                  </ul>                      
               </div> <!-- /columns --> 
            </div> <!-- /Row(nested) -->
         </div>
   <center>
         <p class="copyright">&copy; Copyright 2015 Billy & Carter. CSS template design by <a href="http://www.styleshout.com/">Styleshout.</a></p>        
   </center>
         <div id="go-top">
            <a class="smoothscroll" title="Back to Top" href="index.html"><span>Back to top</span><i class="fa fa-long-arrow-up"></i></a>
         </div>
      </div> <!-- /row -->
   </footer> <!-- /footer -->
&#13;
&#13;
&#13;

0 个答案:

没有答案