[英]how to horizontally align kitchen sink cards in bootstrap?
I am trying to align me kitchen sink cards horizontally here is a picture of the cards.我正在尝试水平对齐厨房水槽卡片,这是卡片的图片。
( https://i.stack.imgur.com/4JIXc.png ) ( https://i.stack.imgur.com/4JIXc.png )
These cards ⬆️ are not aligned horizontally as you see I want them aligned horizontally I tried many CSS & HTML codes but none worked.这些卡片 ⬆️ 没有像您看到的那样水平对齐 我希望它们水平对齐 我尝试了很多 CSS 和 HTML 代码,但都没有用。
This is one line of code I tried:这是我试过的一行代码:
CSS: float:left;clear:none; CSS:浮动:左;清除:无;
you can use a css property called display: flex;
您可以使用名为display: flex;
i that the default flex direction is row is already enabled.我默认的弹性方向是行已经启用。 so you can use this property for your cards main root element.所以你可以将这个属性用于你的卡片主根元素。
You can use:-您可以使用:-
display: flex;
justify-content: center;
on parent element, to horizontally centered the item.在父元素上,将项目水平居中。 There are other values also for justify-content which you can use to align as you want. justify-content 还有其他值,您可以根据需要使用它们进行对齐。
In bootstrap, you can simply use classes:-在引导程序中,您可以简单地使用类:-
d-flex justify-content-center
on parent element, to horizontally centered the item.在父元素上,将项目水平居中。 Similarly there are other classes also.同样还有其他类。 You can see bootstrap docs.您可以查看引导文档。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.