HTML / CSS - 调整大小的3列

时间:2012-09-07 12:16:25

标签: html css layout jquery-masonry

我正在构建一个非常简单的页面,由tumblr提供支持。

主区有3列内容。内容div都设置为33%的宽度并向左浮动,大部分时间按照您的预期自行排列,但是当您调整窗口大小时,它似乎有时会恢复为2列。有谁知道如何解决这个问题?

html在这里:http://emilestest.tumblr.com

3 个答案:

答案 0 :(得分:0)

尝试将.item css宽度设置为:32%。浏览器有时会错误地计算宽度,因此您可能有一两个额外的像素,因此浮动重叠到下一行。

答案 1 :(得分:0)

涉及Javascript操作。您的article html元素获取绝对位置和一些坐标。查看这些脚本(或禁用它们,以便仅使用CSS进行定位)。

答案 2 :(得分:0)

在您的具体情况下,有几种解决方案:

  1. 使用JavaScript将div放置+大小并禁用CSS布局
  2. 使用display: table
  3. 使用table元素
  4. 免责声明:对于所有在阅读table时喊出来的人:

      

    使用分区来模拟表格以显示表格数据与使用表格来控制图形和页面布局一样,也是一个设计缺陷。

    来源:http://en.wikipedia.org/wiki/Tableless_web_design#The_use_of_tables