firefox溢出-y不适用于嵌套的flexbox
我已经使用css3 flexbox设计了100％宽度100％高度的布局，该布局可在IE11上使用（如果对IE11的仿真正确，则可能在IE10上使用）。
但是Firefox（35.0.1），overflow-y无法正常工作。如您在此Codepen中所见：
Firefox无法正确渲染溢出。它显示一个滚动条
html,
body {
height: 100%;
margin: 0;
padding: 0;
border: 0;
}
.level-0-container {
height: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.level-0-row1 {
border: 1px solid black;
box-sizing: border-box;
}
.level-0-row2 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
border: 1px solid black;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
}
.level-1-col1 {
width: 20em;
overflow-y: auto;
}
.level-1-col2 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
border: 4px solid blue;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.level-2-row2 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
border: 4px solid red;
box-sizing: border-box;
overflow-y: auto;
}
<html>
<body>
<div class="level-0-container">
<div class="level-0-row1">
Header text
</div>
<div class="level-0-row2">
<div class="level-1-col1">
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
line <br/>
</div>
<div class="level-1-col2">
<div class="level-2-row1">
Some text
<p/> Some text 2
<p/> Some text 3
<p/>
</div>
<div class="level-2-row2">
<p>some text</p>
<p>some text</p>
<p>some text</p>
<p>some text</p>
<p>some text</p>
<p>some test</p>
</div>
</div>
</div>
</div>
</body>
</html>
问题答案：
TL;博士：你需要min-height:0在你的.level-0-row2规则。
更详细的解释：
弹性项根据其子项的固有大小（不考虑其子项/后代的“溢出”属性）建立默认的最小大小。
每当元素overflow: [hidden|scroll|auto] 在 flex项目 内部 时，都需要给它的祖先flex项目min- width:0（在水平flex容器中）或min-height:0（在垂直flex容器中）以禁用此最小调整行为，否则，flex项将拒绝缩小到小于孩子的最小内容尺寸。
您不会在Chrome中看到此信息（至少在发布时尚未看到此信息），因为他们尚未实现此最小尺寸设置行为。
（编辑：Chrome现在已经实现了这种最小化行为，但在某些情况下，它们可能仍会错误地将最小大小折叠为0。
-
我已经用css3 flexbox设计了一个100%宽度100%高度的布局，它可以在IE11上工作（如果IE11的模拟是正确的，可能也可以在IE10上工作）。 但是Firefox（35.0.1）的overflow-y不起作用。正如您在这个代码笔中看到的：http://codepen.io/anon/pen/NPYVga Firefox无法正确渲染溢出。它显示一个滚动条
-
六羟甲基三聚氰胺六甲醚。。在某些情况下，我有一个对象需要在hazelcast实例上执行操作。所以我实现了HazelcastInstanceAware接口，但这似乎不适用于嵌套类。。。 以下核心输出"null"到控制台： 公共类NullError实现可序列化，HazelcastInstanceAware{私有瞬态HazelcastInstance instance1；私有瞬态HazelcastIns
-
问题内容： 我刚刚更新到Firefox 32，当我尝试运行Selenium Webdriver Test时，我得到以下信息 我期望能够正常运行测试。 有没有人遇到过同样的事情？您是如何解决该问题的？ selenium版本：2.41.0（作为Nuget软件包安装）操作系统：Windows 7浏览器：Firefox浏览器版本：32 问题答案： Selenium2.41.0正式支持的最新Firefox版
-
我试图通过将请求参数直接绑定到用户实体来简化我的代码，而不是一个字段一个字段地复制值，但是我似乎不能通过这种方式得到验证。 控制器： 验证器： 模型(注意嵌套对象用@Valid标注): 问题是只有密码和重新密码字段被正确验证，用户类中的验证注释被忽略，任何密码匹配的请求都通过，但它应该会出现错误。空密码或不同的密码会按预期出现错误。
-
Elasticsearch排序不适用于嵌套字段。它显示了升序和降序的混合值。比如40，30，50。它不是按升序显示的：30，40，50 查询：
-
我正在使用以下方法隐藏键盘 它将输入作为“活动”，并在我点击屏幕时隐藏键盘。如果父布局没有嵌套的子布局，则工作正常。但是如果父布局有嵌套的子布局，即使我在点击嵌套的子布局时仍不使用它们。软键盘没有隐藏。 这个问题的解决方案是为嵌套的子布局创建侦听器，然后再次调用上面的方法。但是，有没有其他方法可以隐藏键盘而不设置内部子布局的侦听器。 下面是我使用的布局 在我的活动中我正在做