html - CSSのポジショニング/サイズ変更の難しさ

Question

これは一部の人にとっては単純な問題なので、そのような基本的な質問を許してください。divレイヤー#section-1の配置に問題があります。基本的に<div> 、画面サイズを大きくしても、内のコンテンツを所定の位置に保持したいと思います。ここをクリック

私はこれを達成するのに叙事詩的に失敗しています。#section-1次のプロパティを設定しました。

    #section-1{
    position: relative;
    width: 100%;
}

また、私#wrapperは次のように設定しました：

#wrapper{
    max-width: 1600px;
    min-width: 320px;
    width: 100%;
    margin: 0 auto;
    position: relative;
}

＃section-1の最大幅を指定して、マージンを適用しようとしました：0 auto; ただし、画面サイズを大きくしても、セクション1内のコンテンツは移動します。

誰かが問題の解決策を持っていますか...？

score 0 · Accepted Answer

両側に幅100pxのマージンの場合：

#section-1{
    position: relative;
    margin: 0 100px;
}

これはラッパーの有無にかかわらず機能することに注意してください。ラッパー内のCSSの多くは不要のようです。

1 に答える 1