始终使缩略图在库中居中
下面是我对主题：http://jsfiddle.net/Z67p4/所做的简单介绍
所以，我的问题是-如果内容是在未来动态生成的，我如何使缩略图始终位于图库的中心？即使一行缩略图少于四个，它们也应该居中，但在它们之间也应该有一个间隔。
我试着摆弄margin: auto，但我弄不明白。
回答 2
Stack Overflow用户
发布于 2013-07-13 01:33:08
两个修复：
解决一个问题：
将text-align:center;添加到容器类
解决方法二：
去掉容器类中的display:inline-block;。它导致容器类以内联方式(如文本)显示，这就证明了它的左对齐。
为了显示这一点，我在容器类上添加了一个bg-color，并使其保留了屏幕60%的空白区域。尽管As you can see有一个“自动”的水平边距，但它从左边缘开始覆盖了60%的屏幕。
三个建议：
建议一：
如果不希望缩略图中的文本居中，请记得添加text-align:left;。div会影响目标元素的所有子元素，这意味着包含container类的text-align的每个子元素都将居中。
建议二：
更让人恼火的是...
尝试找到一种方法来定义内容元素(缩略图)的大小，而不使用百分比。您的页面将能够缩放到不同的屏幕，通过使用不同的，仔细调整大小的元素，这些元素将根据查看大小居中显示。拥有元素的中心和比例可能有些夸张。
建议三：
为容器添加最小宽度。这样，您就不必担心您的元素是否可能因为基于百分比的容器而溢出。
Here是一个结合了修复和我的建议的版本。我已经对我所做的每一处更改进行了注释。
Stack Overflow用户
发布于 2013-07-13 00:36:09
在容器上试用text-align:center
http://jsfiddle.net/Z67p4/9/
https://stackoverflow.com/questions/17619686
复制相似问题
腾讯云开发者
