7
私はプロジェクトで作業していますが、overflow autoでdisplay：tableとtable-rowを使用しています。しかし、Firefox（とIE）では期待通りに動作しません。display：table-row＆overflow：Chrome、Firefox（およびIE）で異なる動作を表示する
Chromeでは、動作する必要があります。
StackOverflowにはthisという質問がありますが、これは私の問題とよく似ていますが、回答やサンプルはありません。
私はJSbinとFiddleでこれを再現しようとしましたが、うまくいきませんでした。私もhere見つけることができる小規模なHTMLの例を、設定している
：私は2 screengrabsを作ったChromeとFirefoxで動作を説明するために
。 ChromeとFirefoxでウェブサイトを開き、下部のコンテナがページをオーバーフローするまでテキスト領域を拡大して再現できます。
コードそれは非常にイライラ
html,
body {
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
.tableWrapper {
display: table;
height: 100%;
background: darkgrey;
table-layout: fixed;
width: 800px;
margin: 0 auto;
}
.textArea {
background: #F9F9F9;
padding: 10px 10px 5px 10px;
margin: 10px;
}
.content {
display: table-row;
height: 100%;
margin: 10px;
}
.content div {
display: block;
overflow: auto;
height: calc(100% - 20px);
height: -webkit-calc(100% - 20px);
height: -moz-calc(100% - 20px);
background: #ADE6DF;
margin: 10px;
}
.content p {
background: white;
margin: 10px;
padding: 5px;
}<div class="tableWrapper">
<div class="textArea">
<textarea></textarea>
</div>
<div class="content">
<div>
<p>
Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam
erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim
mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo
ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam erat volutpat. Fusce volutpat neque eget suscipit lobortis.
</p>
<p>
Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam
erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim
mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam erat volutpat. Fusce volutpat neque eget suscipit lobortis. Quisque eget ipsum lectus. Morbi ac vulputate velit. Phasellus condimentum nec orci eget sodales. Curabitur commodo
ornare consequat. Proin vehicula mattis odio at feugiat. Nunc enim mi, viverra ut enim condimentum, malesuada fermentum felis. Aliquam erat volutpat. Fusce volutpat neque eget suscipit lobortis.
</p>
</div>
</div>
</div>、私は誰かが起こって知っている願っています。
それが匿名テーブルボックスが一緒に（.textAreaがに住んでレイアウトを維持するための場所の上にすべての生成されているという事実とは何かを持っている場合、私は確かに知りません.tableWrapperの匿名テーブル行の匿名テーブルセル、および.content divは.content内の匿名テーブルセルに存在します）。 – BoltClock
@BoltClockこれを修正する方法がありますか？ –
@Patrick Hofman：いいえ、悲しいことです。 – BoltClock