html - 无法让这些并排排列

Question

我无法将它们移动到页面中央。任何人都知道出了什么问题吗？

<ul id="contact">
<h1> Contact </h1>
    <p> Dreamstowheels@yahoo.com </p>
    <p> 2236 El Camino Real <br>
    Santa Clara Ca 95050 </p>
</ul>

<ul id="follow">
    <h1> Follow </h1>
    <img src="http://www.flagera.eu/sites/all/modules/socialmedia/icons/levelten/glossy/32x32/facebook.png">
</ul>

<ul id="supporters">
    <h1> Supporters </h1>
        <p><a href="http://www.cyclinginquisition.com/"    target="_blank">     Cyclinginquisition.com </a></p>
        <p><a href="http://www.colombiacyclingpro.com/" target="_blank"> Colombia Cycling Team </a></p>
        <p><a href="http://calmarcycles.com/" target="_blank"> Calmar Bicycles </a></p>
        <p><a href="https://www.facebook.com/rocksolidcycling" target="_blank"> Rock Solid Cycling </a></p>
        <p><a href="http://www.fastfreddieapparel.com/" target="_blank"> Fast Freddie Foundation </a></p>
        <p><a href="http://www.goldencreekservices.com/" target="_blank"> Golden Creek Services (Envio de Paquetes)  </a></p> 
</ul>
</footer>

CSS

footer{ /*Footer section attributes */
margin: -50px auto;
width: 100%;
text-align: center;
/* border-top: solid 1px;*/
}

如果您需要为联系人、关注和支持者 div 添加 CSS，请告诉我。提前致谢。

Answer 1

用 fiddle 删除 CSS 代码中的所有内容，然后将以下内容放在那里。

footer{ margin:0 auto; text-align:center;}

https://jsfiddle.net/u2Zb2/45/