Question

我在fieldsets中包含了2个<div>，我们称之为blah1和blah2。

blah2可以增长为其<div>父级的最大值，但我需要blah1才能拥有与其同级blah2相同的％{/ p>

Answer 1

答案有点奇怪，但是我让它发挥作用，看起来边缘在这里弄得一团糟，如果我把它设置为margin: 0 5px;那么我可以让fieldsets具有相同的height {1}}作为他们的父母

css 标记的一部分：

fieldset
{
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
    border-radius: 8px;
    margin: 0 5px;
    height: 100%;
}

legend
{
    font-size: 1.2em;
    font-weight: bold;
}
.blahContainer{
    width: 100%;
    height: 100%;
}

.blahColumna1{
    width: 70%;
    height: 100%;
}

如果你想看最后的演示，click here。

希望它可以帮助别人......

Answer 2

尝试将<fieldset>包装在一个不是固定高度的单个容器<div>中 - 它会整齐地包围blah2，并且会长到<div>的最大尺寸{1}}父母。将blah1的高度设置为包含<div>的100％。

Answer 3

我能够通过将padding-bottom添加到仅适用于Chrome的字段集来实现它。这平衡了一些额外的高度％。它很好用，即使在调整大小时也能正常工作（相对一致）。

if (navigator.userAgent.toLowerCase().indexOf('chrome')) { // Replace this with your preferred way of checking userAgent
    $('fieldset').css('padding-bottom', '4%'); // Exact percent may vary
}

就像一个注释，我发现这至少是IE8-IE11中的一个问题，所以修复可以应用于IE。

Fieldset高度为其父级的100％

3 个答案: