Javascript 柔性箱双柱包裹
我试图转换利用flexbox提供2列包装卡 示例:Javascript 柔性箱双柱包裹,javascript,html,css,flexbox,bootstrap-4,Javascript,Html,Css,Flexbox,Bootstrap 4,我试图转换利用flexbox提供2列包装卡 示例: [1] [2] [3] [4] [5] [6] 目前,我不认为这是可能的,因为我目前阅读的所有内容,我能够创建以下内容: [1] [4] [2] [5] [3] [6] 我已经尝试了下面的方法,但不幸的是,我似乎无法让侧对侧选项自动工作 .card列额外设置{ 列数:2; 柱间距:1.25雷姆; 孤儿:1名; 寡妇:1人; 弯曲方向:立柱; 柔性包装:包装; 调整内容:灵活启动; 对齐内容:之间的空间; 调整项目:灵活启动; } .卡片{
[1] [2]
[3] [4]
[5] [6]
目前,我不认为这是可能的,因为我目前阅读的所有内容,我能够创建以下内容:
[1] [4]
[2] [5]
[3] [6]
我已经尝试了下面的方法,但不幸的是,我似乎无法让侧对侧选项自动工作
.card列额外设置{
列数:2;
柱间距:1.25雷姆;
孤儿:1名;
寡妇:1人;
弯曲方向:立柱;
柔性包装:包装;
调整内容:灵活启动;
对齐内容:之间的空间;
调整项目:灵活启动;
}
.卡片{
宽度:100%;
位置:相对位置;
显示器:flex;
弯曲方向:立柱;
最小宽度:0;
单词包装:打断单词;
}
换行的卡片标题
这是一张较长的卡片,下面的支持文本是附加内容的自然引入。这个内容有点长
Lorem ipsum dolor sit amet,是一位杰出的献身者。整数赌注
在源代码标题中有名的人
卡片标题
此卡片具有以下支持文本,作为附加内容的自然引入
上次更新是在3分钟前
Lorem ipsum dolor sit amet,是一位杰出的献身者。整数posuere-erat
在源代码标题中有名的人
卡片标题
此卡片具有以下支持文本,作为附加内容的自然引入
上次更新是在3分钟前
Lorem ipsum dolor sit amet,是一位杰出的献身者。整数赌注
在源代码标题中有名的人
卡片标题
这是一张更宽的卡片,下面的支持文本是附加内容的自然引入。这张卡片的内容甚至比第一张要长,以显示等高动作
上次更新是在3分钟前
看起来更像是行而不是列。有什么特别的原因需要列吗?@worc它只需要像示例shhown那样放入两列中,行flex是否可行?flexbox行的顺序是从左到右,但是列的“砌石”效果不起作用,因为flexbox行的高度相同