0

这是我的 html/css 代码。请水平移动边框，直到最后一行包含的元素少于上面的行。

http://jsfiddle.net/wb5kT/

问题从这里开始。我确实想将整个东西水平居中，所以从页面边框到文本的左右距离是相同的。但是，最后一个可见行应该左对齐。我事先不知道视口的宽度或元素总数。

将“text-align: left”添加到 .images 将最后一行中的元素向左对齐，但会破坏整个“中心对齐”的东西。示例：http: //jsfiddle.net/dgLQC/1/

可以不使用表格来完成吗？

IE 8 或更低以及其他浏览器的旧版本可以忽略。

4

3 回答 3

0

我认为即使使用表格也无法做到这一点；一旦您的内容对于容器来说太宽，容器将采用其父级的宽度，即使内容恰好被包装以适应较小的宽度。

顺便说一句，要确保最后一行（假设不止一行）元素不完整，请选择素数的元素。

于 2012-05-13T20:54:41.317 回答
0

放入。float:left_.thumb

看到这个，http://jsfiddle.net/C5Pev/

更新：

我不好，上面的代码没有按预期工作。一个可能的解决方法是，

http://jsfiddle.net/C5Pev/7/

于 2012-05-13T20:06:49.340 回答
0

不确定我是否正确理解了您的问题，但似乎您需要将最后一行（两个 div）内的文本向左对齐，同时保持所有其他文本居中：

您可以为此申请一个课程：

.alignLeft {
    text-align: left;
}

并将该课程分配给最后两个 div。

这是小提琴的例子！

编辑：

你的问题应该改写，它会导致你的目标是错误的结论，但这是你正在寻找的：

请参阅此小提琴示例！

相关 CSS 更新：

.thumb {
  float: left;              // align divs to the left of each other
  text-align: center;       // center text inside the div
  position: relative;
  border: 1px solid #D9D9D9; // view the blocks, not needed
  margin: 1px;               // get some distance between blocks, not needed
  font-size: 10px;           // small text to view that's centered, not needed
}

提示： 水平收缩，直到你得到 3 个块的行，因此有两个 div 与文本我在最后一行！一个人在最后一排。

于 2012-05-13T20:11:03.150 回答