私はセクションに分割されたウェブページを持っていました残念なことに私は応答性が必要でしたので、body要素にdisplay：flexスタイルを与えましたsect-1とsect-2は身体の子であるため、期待どおり積み上げています。問題は絶対に配置されていたフレックスアイテム内のコンテンツですが、今ではセクション1とセクション2、さらにはページ全体から位置付けされていません。なぜ絶対位置指定はフレックスアイテムの親を無視するのですか？フレックスオブジェクトの子を配置するにはどうすればよいですか？
HTML：
<body>
<div id="sect-1">
<h2 id="quote">I AM A WEB DESIGNER_</h2>
</div>
</body>
コンテナCSS：
body {
display: flex;
flex-direction: column;
overflow-x: hidden;
}
最初のフレックスオブジェクト：
#sect-1 {
background: none;
width: 100vw;
height: 100vh;
left: 0vw;
z-index: 98;
}
また、私はflexオブジェクト（コンテナではない）の内側に配置する必要があります。
#quote {
align-content: left;
font-family: Courier New;
color: black;
font-size: 25px;
letter-spacing: 5px;
line-height: 0px;
width: 500px;
position: absolute;
top: calc(50vh - 12.5px);
left: calc(50vw - 190px);
}
回答：
回答№1は1のために quote フレックスアイテムの内部に位置する sect-1、 sect-1 他のポジションをとる必要がある static、 通常は relative 1つの用途です。
body {
display: flex;
flex-direction: column;
overflow-x: hidden;
}
#sect-1 {
position: relative; /* added */
background: none;
width: 100vw;
height: 100vh;
left: 0vw;
z-index: 98;
}
#quote {
align-content: left;
font-family: Courier New;
color: black;
font-size: 25px;
letter-spacing: 5px;
line-height: 0px;
width: 500px;
position: absolute;
top: calc(50vh - 12.5px);
left: calc(50vw - 190px);
}<body>
<div id="sect-1">
<h2 id="quote">I AM A WEB DESIGNER_</h2>
</div>
</body>