css - 如何计算 CSS minmax() 的单元格需要的最小长度？

Question

我正在尝试设计一些 CSS 网格。

我想将 MINIMUM 长度设置为顶部单元格需要
将其所有文本保留在一行中的空间量。例如：

<h2 id="dominantCell">This is some text</h2>
<style>
    #dominantCell {  /* I don't know how long the text is in one line */
       grid-template-columns: minmax( /* <h2>'s width */ , 100%)
    }    /* How do I find out what the min should be WITHOUT counting pixels? */
</style>

我如何合理地计算这样的东西而不每次都计算像素？

标签： csscss-gridminmax

Answer 1

试试这个：

grid-template-columns: minmax( min-content, 100% )

或者

grid-template-columns: minmax( min-content, 1fr )

有关. _ _min-content