问题标签 [css-multicolumn-layout]

我有一个网页，其内容（单个div和很多带有格式的文本）被 CSS3 分成几列（30-40）（通过column-height和column-width）

有什么方法可以获取特定列的内容（该列内的文本）？欢迎任何语言、框架或算法:)

我目前正在开发一个原型，它使用 CSS3 多列来划分内容，它似乎运行良好。我的问题是，作为列的一部分的块内部有一个扩展的高度部分，并且在 Firefox 中，当 CSS3 多列中的元素的高度发生变化时，它会消失，然后 Firefox 崩溃。

CSS3 多列不应该考虑内部不同的高度内容，或者它不是为那种事情而设计的吗？我真的很讨厌必须使用像 Columnizer 这样的插件，因为 Columnizer 要正常工作很麻烦。

这是布局：

问题是一旦单击链接并且高度发生变化，就好像它失去了布局和定位（高度和宽度变为 0），然后 Firefox 崩溃。如果我使用 Firebug 手动更改高度，情况也是如此。

我正在尝试使用新的多列布局设置多列布局。但是无论如何允许创建列的灵活宽度？
我在网上看到的所有策略总是导致固定宽度的布局，即使内容溢出列也是如此。

JSFiddle 示例

我正在寻找一种为网站创建报纸布局的方法，其中内容分为两列，但在列的中间有一个引号框。

我知道如何使用 CSS3 和

但是我如何在中间创建引号框，有什么方法可以将内容“包裹”在中间框周围的列中？

我附上了我的意思的插图。
请想象在这个插图中，两列中的文本被包裹在中间的盒子周围。

我正在为 Windows 8 开发基于 JavaScript 的 Metro 应用程序。我正在尝试设置具有多列文章的容器背景。基本上，我在左侧有一个列表视图，在右侧有一个多栏文章（类似于拆分视图）。

我正在尝试将文章流设置为水平（使用 column-width CSS 属性的多列），但是当我设置文章的背景时，它只设置到视口边缘。

使用 Split App 模板创建新项目，并将以下 HTML替换为split.html 中的当前 HTML（内部正文标记）：

将 split.css 文件的内容替换为以下内容：

运行应用程序并单击集线器上的任何磁贴以查看 split.html。向右滚动，注意背景色文章不正确。

我正在尝试编写灵活的代码，其中我有一个简单的代码，<ul>它会自动为每 5 个元素创建另一列。我找到了一个实现这一点的教程，但将项目按水平顺序放置，而我需要垂直顺序。我看过其他一些教程，它们输出垂直顺序，但也附加了class="first"和class="second"，li这不是我想要的。我希望使用我现有的 HTML 代码。

我想要的是：

是）我有的：

CSS：

HTML：

我的 CSS 列在 Chrome 中的显示方式与它们在 Firefox 和 IE9 中的显示方式不同。这是 Firefox 中的正确显示：

以下是它在 Chrome 中的错误显示方式：

我尝试将 to 更改li为display: inline-block，这是 Chrome 中的一种改进，但随后较窄的列表项出现在同一个“单元格”中。

我制作了一个 JSFiddle来演示这个问题。

所以我刚刚发现了 css3columns规范，并立即看到我可以使用它来“现代化”我的论坛列表，该列表使用动态生成的表格。

生成表的代码非常复杂，因为它自己决定是否将下一个数据库行的数据放入表中的新行或新列中。使用 css3 列的方式，我假设我可以简单地让代码将数据读入页面并让 css3 决定应该进入哪一列。

不过，我遇到了一些问题。使用它时，内容不会跨指定数量的列进行拆分。

这里有一些代码供参考：

我设置了这个 JSFiddle 进行测试：http: //jsfiddle.net/LYoung/JLVEs/1/

显然我做错了什么。谁能帮我确定那是什么以及为什么错了？

我正在为特定设备创建一个 2 列的 epub 书。我的问题是，当我使用 css 指定 时columns ( -webkit-column-count: 2; -webkit-column-rule: 0px;)，最终结果是：

在第 1 页上显示（第 1 部分 | 第 3 部分），以及

在第 2 页上，它显示了这首诗的（第 2 部分 | 第 4 部分）。

我宁愿以更自然的书流来做，这应该显示

（第 1 部分 | 第 2 部分）第 1 页，然后继续

（第 3 部分 | 第 4 部分）第 2 页。

有没有办法存档这个？

一些附加说明：

1. 我试图限制列高，但它所做的只是添加第三列，这不是我想要的。
2. 这本书的内容是动态生成的，因此我无法提前指定休息的位置。

我正在构建一个网站并主要在 Chrome 上对其进行测试，间歇性地检查它是否仍然可以在 Firefox 上运行。

我想，由于 Chrome 和 Safari 都在 WebKit 上运行，它们会以相同的方式呈现网站。但事实并非如此。

我在 Safari 上检查该网站，我注意到我的菜单栏使用了一个无序列表column-count（两者都-moz-具有-webkit-相同的值），并注意到列的填充之间存在差异。

Chrome 似乎均匀地填充列，而 Safari 只是一一填充列。下面的图片说明了这一点。

铬呈现：

Safari 呈现：

我非常喜欢 Chrome 呈现列的方式，所以我想知道是否有办法强制 Safari 以这种方式呈现网站，可能html根本不改变布局。

注意： Firefox 的渲染与 Chrome 相同，无需修复。我不是为 IE 开发的，所以我不知道它是如何呈现的。