html - 使 div 始终为 100% 高度

标签 html css twitter-bootstrap twitter-bootstrap-3

<分区>

我的问题是我无法使 div megrendeles_right_box 始终为 100% 高度。

我尝试使用 height:100%;min-height:100%;,但除了填充外它无法正常工作。

另外,我为正文写了这些样式,但它仍然不起作用。

这个问题是不是因为使用了Bootstrap才出现的?我在这里添加了我的样式。

我做错了什么?

<div class="megrendeles_main_container">
<div class="col-md-6 megrendeles_left_box">
    <form method="post">
        <h2 class="megrendeles_form_title">Személyes adatok</h2>
        <div class="form-group col-md-4">
            <span class="megrendeles_input_title">Vezetéknév *</span>
            <input required type="text" name="user_vnev" id="user_vnev" class="form-control megrendeles_input_2 input-lg" value="">
        </div>
        <div class="form-group col-md-4">
            <span class="megrendeles_input_title">Keresztnév *</span>
            <input required type="text" name="user_knev" id="user_knev" class="form-control megrendeles_input_2 input-lg" value="">
        </div>
        <div class="clearfix"></div>
        <div class="form-group col-md-8">
            <span class="megrendeles_input_title">E-mail *</span>
            <input required type="text" name="user_email" id="user_email" class="form-control megrendeles_input_2 input-lg" value="">
        </div>
        <div class="clearfix"></div>
        <div class="form-group col-md-8">
            <span class="megrendeles_input_title">Telefonszám *</span>
            <input required type="text" name="user_tel" id="user_tel" class="form-control megrendeles_input_2 input-lg" value="">
        </div>
    </form>
</div>
<div class="col-md-6 megrendeles_right_box">

</div>
<div class="clearfix"></div>

一些CSS:

.megrendeles_main_container{ width:100%;  }


.megrendeles_form_title{ padding:0 15px; display:block; margin-bottom:15px; color:#1e1e1e; font-size:22px; font-weight:700; }


.megrendeles_left_box{ background:#fff; height:100%; padding:40px; }
.megrendeles_right_box{ background:#efefef; height:100%; padding:40px; }

最佳答案

那是因为你的父 div 没有高度。百分比是相对数量吧?但是你仍然可以使用 100vh 来获得全屏高度

关于html - 使 div 始终为 100% 高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53515443/

上一篇:css - 插入嵌套元素

下一篇:javascript - 单击按钮时如何添加CSS

相关文章:

javascript - 我如何编写一个函数,如果它的参数是一个 Node 集合,则对 javascript 中的所有 Node 元素执行?

html - 如何配置我的 HTML 以使用 i18next?

Html 到 FOP 与 XSLT : css class to attribute-set

javascript - .hover() 和 .click() 不能一起使用吗?

javascript - 单击下拉菜单移动不工作

html - IE7 中的 Bootstrap 边框问题

twitter-bootstrap - 将一列推到另一行

jquery - 扩展 Bootstrap 选择插件

html - Typo3:将类添加到默认内容包装

html - 使用 Google Maps 元素定义 div (CSS) 的百分比高度