如何使卡片列水平排列? [英] How do I make card-columns order horizontally?

查看:120
本文介绍了如何使卡片列水平排列?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一张智能滚动牌列表,虽然我喜欢card-columns的外观,但令人沮丧的是它按从上到下的顺序排列,如下所示: 1 4 7 2 5 8 3 6 9

I have a smart-scrolling list of cards, and while I love the look of card-columns, its pretty frustrating that it orders top to bottom, like so: 1 4 7 2 5 8 3 6 9

这种垂直排序对于内容加载多于一些项目的任何事物似乎基本上是无用的.如果我有50个项目,那么一些最不重要的项目将位于顶部!

This vertical ordering seems basically useless for anything where the content loads more than a few items. If I have 50 items, some of the least important ones will be at the top!

我已经尝试过使用flexbox进行一些变体,但是什么也没用.有人能进行水平排序吗?

I've tried some variations using flexbox, but couldn't get anything to work. Does anyone have horizontal ordering working?

推荐答案

记录,CSS列的顺序是从上到下,然后是从左到右,因此呈现的列的顺序将是..

As documented, the order of the CSS columns is top to bottom, then left to right so the order of the rendered columns will be..

1  3  5
2  4  6

无法更改CSS列的顺序.建议您使用其他解决方案,例如砌体. https://github.com/twbs/bootstrap/issues/17882

There is no way to change the order of CSS columns. It's suggested you use another solution like Masonry. https://github.com/twbs/bootstrap/issues/17882

这篇关于如何使卡片列水平排列?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆