如何解决证明内容之间的合理性在父级flex中不起作用
我使用div
显示器的flex
显示器父级添加flex
。
HTML:
<div class="d-flex align-items-start flex-column" style="height: 100px;">
start
</div>
<div class="d-flex align-items-end flex-column" style="height: 100px;">
<div class="d-flex justify-content-between align-content-center">
<div>
left
</div>
<div>
right
</div>
</div>
</div>
实际上,我需要在div
和left
中显示两个right
,所以添加justify-content-between
类,但是该类不起作用并且不在左右显示。如何解决此问题?!
演示here
解决方法
您需要从“ left and right”的父div中删除“ align-items-end”,然后它才能起作用。
已编辑:
对此的解释是,如果您在父div上使用d-flex以及“ align-items-end”,那么将发生的事情是父div将所有项目与父div的flex末端对齐,因此在在这种情况下,父div内的项目与父div的flex的“ end”对齐,而“ justify-content-between”不起作用,原因是这些项目卡在父div的“ flex的”末端。希望这可以帮助。谢谢。
,<div class="d-flex align-items-start flex-column" style="height: 100px;">
start
</div>
<div class="d-flex justify-content-between align-content-center" style="height: 100px;">
<div>
left
</div>
<div>
right
</div>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。