首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在我设置了parent的值之后,h-* value * bootstrap类怎么不工作了?

在我设置了parent的值之后,h-* value * bootstrap类怎么不工作了?
EN

Stack Overflow用户
提问于 2019-06-04 02:48:55
回答 1查看 175关注 0票数 0

我希望这些div是250px。当我进入Site.css文件并编写下面的第二个代码时,它就可以工作了……

代码语言:javascript
复制
<div class="container h-100" style="height:500px;">
    <div class="row row-no-gutters" style="height:500px;">
        <div class="col-sm-4 h-50 bg-success">.col</div>
        <div class="col-sm-4 h-50 bg-success">.col</div>
        <div class="col-sm-4 h-50 bg-success">.col</div>
    </div>
</div>
代码语言:javascript
复制
.h-50{
    height:50%;
}
EN

回答 1

Stack Overflow用户

发布于 2019-06-04 03:14:49

h-*类有!important标记。因此,它将始终优先于内联样式。

所以你的容器被设计成100%的高度而不是500px。

要解决这个问题,只需将h-100从容器中取出,并在容器或行上应用内联高度:

代码语言:javascript
复制
<div class="container">
    <div class="row" style="height: 500px;">
        <div class="col-sm-4 h-50 bg-success">.col</div>
        <div class="col-sm-4 h-50 bg-success">.col</div>
        <div class="col-sm-4 h-50 bg-success">.col</div>
    </div>
</div>

演示: https://jsfiddle.net/davidliang2008/rkvztch0/3/

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

https://stackoverflow.com/questions/56432978

复制
相关文章

相似问题

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