ちょっと説明が難しいのでURLを載せておきます。
http://www.ucaftercruz.comにアクセスしてください
フッターを見ると、縦に並べられた順序付けられていないリストがあります。ブラウザをドラッグして小さくすると、リストが 1 行から 2 行になります。ウィンドウのサイズに関係なく、1 行でフッターの中央に表示されるようにするにはどうすればよいですか?
それは私のdivと関係があると思われます。
これが私のhtmlコードです:
<div style="clear:both;">
<div id="footer">
<div id="footer-pages">
<ul>
<li><a href="http://www.ucaftercruz.com/about/">About the blog</a></li><span>•</span>
<li><a href="http://www.ucaftercruz.com/blographies/">The Authors</a></li><span>•</span>
<li><a href="#">Archives</a></li><span>•</span>
<li><a href="http://www.ucaftercruz.com/credits/">Credits</a></li><span>•</span>
<li><a href="http://www.ucaftercruz.com/faq/">FAQ</a></li>
</ul>
</div>
そして、ここに私のCSSがあります:
#footer {
height: 100px;
background-color: #d0cabc;
font-size: 12px;
}
#footer a {
color: #606060;
}
#footer-pages {
padding: 20px 0;
border: 0px solid green;
margin: 0 auto;
width: 35%;
}
#footer li {
display: inline-block;
margin: 0 15px;
}