css - Is there a way to ensure all text-align: center text is indeed centered? -


i attempting assemble footer bootstrap. reason footer links appear off-center, despite making sure text-align: center; applied. there way ensure text elements indeed aligned properly?

html

<!doctype html> <html>   <body>     <div class="container-fluid">       <section class="row-fluid">         <div class="span12">           <h1 class="landing">             lorem ipsum           </h1>           <h4 class="landing">             lorem ipsum lorem ipsum lorem ipsum           </h4>         </div>       </section>     </div>     <footer class="footer">       <section class="row-fluid">         <ul class="footer-links">           <li>             <a href="#">contact</a>           </li>           <li>             <a href="#">about</a>           </li>         </ul>       </section>     </footer>   </body> </html> 

css

h1.landing {   text-align: center;   font-size: 400%; }  h4.landing {   text-align: center; }  .footer-links {   list-style-type: none;   text-align: center; }  .footer-links li {   display: inline;   padding-right: 10px; } 

it appears ul has left padding. try removing it.

.footer-links {   list-style-type: none;   text-align: center;   padding:0px; } 

http://jsfiddle.net/s8mgk/1/


Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -