当前位置：文江博客话题详情

使用 -moz/webkit 列宽 CSS 时，为什么我不能将多个帖子并排浮动？

发布于 2024-12-03 17:18:58 字数 235 浏览 1 评论 0原文

在我正在设置的博客上， http://beerwhich.com/blogFun/index.html，我使用column-width属性来创建水平阅读体验。

问题：尽管浮动了两个帖子，但我似乎无法让多个帖子水平并排显示。

任何建议/知识将不胜感激！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

眼泪淡了忧伤 2024-12-10 17:18:58

@肖恩； column-width 属性没有问题，只需为您的 .container div（父 div）提供宽度，为 child div 腾出空间

例如：

.container {
    height: 100%;
    overflow: hidden;
    padding: 20px 0 0 100px;
    width: 4270px;
}

编辑：

正如您所说，您不想指定 div 的宽度。因此，也许您可以执行此

CSS:

.container {
    white-space: nowrap;
}
.post {
    display: inline-block;
    padding: 110px 0 0;
    white-space: normal;
}
.post .text {
    -moz-column-count: 3;
    -moz-column-gap: 20px;
    -moz-column-width: 320px;
    height: 500px;
}
.column {
    display: inline-block;
}

检查示例 http://jsbin.com /oruyir/18 根据您的文本提供 column-count: 属性。

@Sean; there is no problem with column-width property just give width to your .container div(parent div) which make space for child divs

For example:

.container {
    height: 100%;
    overflow: hidden;
    padding: 20px 0 0 100px;
    width: 4270px;
}

EDIT:

As you said that you don't want to specify width to your div's. So, may be you can do this

CSS:

.container {
    white-space: nowrap;
}
.post {
    display: inline-block;
    padding: 110px 0 0;
    white-space: normal;
}
.post .text {
    -moz-column-count: 3;
    -moz-column-gap: 20px;
    -moz-column-width: 320px;
    height: 500px;
}
.column {
    display: inline-block;
}

check is example http://jsbin.com/oruyir/18 give column-count: property according to your text.

回复收藏 0 原文