通过列数控制分布

Question

问题：http://www.offprint.am/0811861538/

有没有办法阻止该内容包含在单个 p /p 中，以免在列之间拆分？将它包含在 div 中并赋予它高度属性似乎可行，但我正在寻找更通用的东西/不是逐个条目的基础。

理想情况下，除非有大量文本（http://www.offprint.am/wp/3836516861/），否则我希望描述位于左侧，信息位于右侧。我可以在列容器外部使用两个 div (float:left) 来完成此操作，但我很难让它们居中。

后者（带 div）将是首选解决方案，但我会立即寻求任何帮助。

另外：

.entry 是带有列计数等的主要容器。为了解决浮动问题，我制作了两个容器（.desc 和 .info）display: block; float:left 并从 .entry 借用了 border/spacing 属性 (.desc padding-right:30px; border-right: 1px dashed #eee; / .info padding-left: 30px;)

虽然它做了我想要的事情大多数情况下，它根本不会居中。

Answer 1

从 .entry 中删除以下内容：

-moz-column-count: 2;
-moz-column-gap: 60px;
-moz-column-rule: 1px dashed #EEEEEE;

添加 add overflow: hide;

然后将 .entry p 修改为：

.entry p {
    border-right: 1px dashed #EEEEEE;
    float: left;
    margin: 0 30px 15px 0;
    padding-right: 30px;
    width: 395px;
}

同时添加以下内容：

。条目.info {
浮动：向左；
宽度：300px；
}