Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/34.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
css表格单元格内100%高度柔性_Css_Flexbox - Fatal编程技术网
Fatal编程技术网
  • css/
  • css表格单元格内100%高度柔性

css表格单元格内100%高度柔性

css

css表格单元格内100%高度柔性,css,flexbox,Css,Flexbox,我有一个包含多个单元格的表格，没有关于单元格高度的任何信息，但我希望其中一个单元格（flexbox容器）的内容高度占单元格高度的100%： 一些内容 这应该是100%的高度 您可以将td高度设置为0，然后将外部div的高度设置为100%。检查以下代码： <table border="1"> <tr> <td style="height: 0"> <div style="height: 100%">some content

我有一个包含多个单元格的表格，没有关于单元格高度的任何信息，但我希望其中一个单元格（flexbox容器）的内容高度占单元格高度的100%：


一些内容
这应该是100%的高度
您可以将
td
高度设置为0，然后将外部div的
高度设置为100%。检查以下代码：


<table border="1">
  <tr>
    <td style="height: 0">
      <div style="height: 100%">some content</div>
    </td><td style="vertical-align: top">
      <div style="display: flex; flex-wrap: wrap;">
        <div style="height: 100%; min-height: 100%; flex: 1; background: red">
          This should take 100% height
        </div>
      </div>
    </td>
  </tr>
</table>




一些内容
这应该是100%的高度

td上的高度：0，然后高度：第一个高度的100%div@TemaniAfif令人惊叹的！你想把这个作为回答，这样我就可以接受了吗？顺便问一下，这是黑客行为还是故意的行为？它在所有浏览器中的工作方式都一样吗？谢谢这是一个半黑客和预期的结果，因为高度：0将确保百分比高度将工作，但不会给单元格一个等于0的高度，因为它在表中。。。我在搜索解释这一点的副本。我在这方面搜索了很多副本，但没有找到任何副本：（@TemaniAfif感谢您花时间找到正确的问题：-）感谢您的回答，但@TemaniAfif在您回答之前6分钟提供了与评论完全相同的答案，我已经建议他在这里添加他的答案。我们正在寻找一个重复的问题…哦，当他评论时，我应该测试我的解决方案。很抱歉很公平。请在他回答后，把他的答案标为可以接受。如果你们愿意，请把我的答案也标记为有用！干杯