有没有办法使用FlexBox在不同的行上获得相同的列宽?
我想为cell-id(宽度必须具有最大cell-width的宽度)具有相同的宽度.
例:
<div class="container"> <div class="row"> <div class="cell cell--id">1</div> <div class="cell">Test</div> </div> <div class="row"> <div class="cell cell--id">2222</div> <div class="cell">Test</div> </div> </div>
CSS:
<style> .row { display: flex } </style>
解决方法
你基本上是在描述一个表,所以你可能应该使用表格布局,例如
.row { display: table-row } .cell { display: table-cell }
<div class="container"> <div class="row"> <div class="cell cell--id">1</div> <div class="cell">Test</div> </div> <div class="row"> <div class="cell cell--id">2222</div> <div class="cell">Test</div> </div> </div>
如果你在flexBox上设置了死机,我会看到两个选项:
>如果你的行高度相同,你可以换成列专业 – 即把你的列div放在行div之外
>手动管理列的大小,类似于:http://inlehmansterms.net/2014/10/11/responsive-tables-with-flexbox/
但实际上,我认为你想要表格布局.
原文地址:https://www.jb51.cc/html/225595.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。