0
別のHTMLページのフレームとして機能するウェブサイトを作成しています。 私が必要とするレイアウトは、サイトタイトルのセクションであり、セクション内にオブジェクトがネストされているメインパーツの下にあります（1つしか表示されないので、この構造が重要です）。 Firefox上で何らかの理由で私はそれを見ていますが、Chrome上では "オブジェクト"が100％の高さに広がることはありません。ウェブサイトのレイアウト
コード：
body {
\t margin-left: 0%;
\t margin-right: 0%;
\t height: 100vh;
\t margin-top: 0%;
\t margin: 0 auto;
\t display: flex;
\t flex-direction: column;
\t z-index: 0;
}
.site-title {
\t height: 50px;
}
.main-menu {
\t position: fixed;
\t display: inline-block;
}
.main {
\t height: auto;
\t flex-grow: 1;
\t display: flex;
\t flex-direction: column;
}
section {
\t border: 5px solid pink;
\t color: #FFFFFF;
\t overflow: hidden;
\t flex-grow: 1;
\t height: auto;
}
object {
\t border: 5px solid #FFFFFF; \t
\t width: 100%;
\t height: 100%;
}<!DOCTYPE html>
<html lang="en">
<head>
\t <meta charset="UTF-8">
\t <link rel="stylesheet" type="text/css" href="css/theme.css">
</head>
<body>
\t <div class="site-title"> \t
\t \t <h1>Strawberry</h1>
\t </div>
\t
\t <div class="main" id="main">
\t \t <section class="instance">
\t \t <object data="home.html"></object>
\t \t </section>
\t </div>
</body>
</html>
私はChromeを使用しています。それは私にとって望ましいものとして働く。あなたの '.object'に' min-height：100％ 'を加えてみてください –
スニペットは私には空白です。 Btw何かを高さ100％にしたい場合は、html、bodyなどから始めて上記のすべてが必要です。 –