将float：left divalignment到中心？
我想要在页面上水平显示一组图像。 每个图像下面有几个链接，所以我需要在每个图像/链接组周围放一个容器。
最接近我得到我想要的是把他们在浮动的div：左。 问题是我想容器alignment中心没有离开。 我怎样才能做到这一点。
使用display:inline-block; 而不是浮动
你不能在浮动中心，但内联块中心，如果它们是文本，所以在“行”的外部整体容器 – 你可以设置text-align: center; 然后为每个图像/标题容器（这是那些将inline-block; ）如果你需要，你可以重新alignment文本左侧
我们现在生活在2016年，CSS Flexbox得到了很好的支持 。 去这里找一个关于flexbox的好教程。
这在所有较新的浏览器中都能正常工作：
#container { display: flex; display: -webkit-flex; /* Safari 8 */ flex-wrap: wrap; -webkit-flex-wrap: wrap; /* Safari 8 */ justify-content: center; -webkit-justify-content: center; /* Safari 8 */ } .block { width: 150px; height: 150px; background-color: #cccccc; margin: 10px; }
<div id="container"> <div class="block">1</div> <div class="block">2</div> <div class="block">3</div> <div class="block">4</div> <div class="block">5</div> </div>
试试像这样：
<div id="divContainer"> <div class="divImageHolder"> IMG HERE </div> <div class="divImageHolder"> IMG HERE </div> <div class="divImageHolder"> IMG HERE </div> <br class="clear" /> </div> <style type="text/css"> #divContainer { margin: 0 auto; width: 800px; } .divImageHolder { float:left; } .clear { clear:both; } </style>
只需在<div>包含浮动元素，并将其赋予此CSS：
.wrapper { display: table; margin: auto; }
.contentWrapper { float: left; clear: both; margin-left: 10%; margin-right: 10%; } .repeater { height: 9em; width: 9em; float: left; margin: 0.2em; position: relative; text-align: center; cursor: pointer; }
