皆さん、こんにちは。
このコードにボーダーラジウスを追加し、下部を希望通りにしました。
しかし、上部を修正できません。
上部を下部と同じように見せるには、どのようなコードを追加すればよいですか？
例： top-height-size: -30%; ですが、これは機能しません。
body:before {
display: inline-block;
border-radius: 15px;
width: 1125px;
min-height: 100%;
height: inherit;
background-color: #fff;
content: " ";
position: fixed;
left: 50%;
right: 0;
transform: translate(-50%, 0);
-webkit-transform: translate(-50%, 0);
}
申し訳ありませんが、何が必要なのか明確ではありません。以下の点について、もう少し詳しく教えていただけますでしょうか。
英語が下手ですみません。助けてくれてありがとう。
大丈夫です。あなたの英語は上手ですが、コードについて話すのは難しいことがありますね！詳細を追加していただきありがとうございます。問題は理解できたと思います。
時々、margin-top を使用して上にスペースを追加することができます。
しかし、スクロールすると機能しません！
これは、body:before の部分に position: fixed があるため、常に画面上の同じ位置にとどまるからです。代わりに position: absolute に変更しましょう。「絶対」は、端からどれだけ離したいかを指定できます。側面に body を使用するように指示する必要があるため、次のコードを追加する必要があります。
body {
position: relative;
}
（position、fixed、absolute についてもっと知りたい場合は、こちら の投稿に例があります）
さて、body:before から min-height: 100% を削除しましょう。100% より短くしたいからです。これで、上と下の位置を制御できます！top: 70px と bottom: 30px を追加しましょう。（上部は、画面上部からのヘッダーを通過するのに十分な大きさにする必要があります）。
これでご希望通りになりましたか？理解できたか教えてください。 
素晴らしい！\n既製のコードを渡すのではなく、教えてくれてありがとう。
\n@bryce
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
