首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >CSS: min高度:min内容无法覆盖高度

CSS: min高度:min内容无法覆盖高度
EN

Stack Overflow用户
提问于 2022-01-08 02:53:03
回答 1查看 179关注 0票数 1

我在这里重现了一个我一直在面对的玩具例子

https://jsfiddle.net/958z6ckh/3/

代码语言:javascript
运行
复制
.test{
  height: 5px;
  min-height: min-content;
  background: red;
  border: solid;
}
代码语言:javascript
运行
复制
<div class="test">
  <div>
    testljalfdkajsfldjdsalfjdsalfxsdal
    asfsadfasdfslafjlskdjfklsdjfklslsf
    askdlfjdslkajflkdsajflktestljalfdk
    ajsfldjdsalfjdsalfxsdal
    asfsadfasdfslafjlskdjfklsdjfklslsf
    askdlfjdslkajflkdsajflk
  </div>
</div>
代码语言:javascript
运行
复制

我已经找到了类似的问题,但没有找到关键的答案,为什么min-height: min-content;不能覆盖that属性。谢谢

编辑:为了澄清,这是一个人为的例子。最初想要的结果是创建一个平滑的滚动网页,其中每个部分的高度等于视图高度减去导航栏,除非它不足以防止溢出或需要内容滚动。仅用min-height: calc(100vh - 80px);就可以实现同样的结果。这个bug只是让我调查了一下为什么上面的例子中的代码没有产生相同的结果,并且似乎忽略了min-height

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-01-08 08:20:31

来自规格

min-content 在相关轴中使用最小内容大小;对于一个框的块大小,除非另有规定,这相当于其自动大小

然后是“自动大小”:

对于min-width/min-height,指定一个自动最小大小。但是,除非相关布局模块另有定义,否则将解析为使用值0.

因此,min-height: min-content将决定采用min-height: 0。换句话说,这是没有效果的。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/70629269

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档