-1

このページを作成しようとしています: http://ascendancyconsulting.com/Landings/ACConsult1.html しかし、物事を適切に中央に配置するのに問題があります。ウィンドウサイズに合わせてスケーリングしたいので、可能であれば固定幅を設定せずにこれを行うことをお勧めします。

1. 見出しが「シェル」div の中央に配置されていません。2. ウィンドウを狭くすると、オプトイン ボックスが中央の列に重なって表示されます。停止して横向きのスクロール バーを作成するだけではありません。3. 下部にある 3 つのバッジ/ボタンは水平に並んでいるはずですが、そのうちの 1 つが下に表示されています。また、（可能であれば）「左バッジ」divに当たったときに停止するのではなく、ウィンドウが狭くなるにつれて左に移動する必要があります。

うまく流れるようにするには、どのような変更が必要ですか? div レイアウトは理にかなっていますか、それとも間違っていますか??

4

2 に答える 2

0

このタイプの問題については、Twitter Bootstrap を見るとより効果的です。これは、セットアップ済みの css ファイルを含むライブラリであり、作業を高速化でき、ウィンドウの幅などに応じて自動サイズ変更および移動できます。

ここを見てください：http://twitter.github.io/bootstrap/

次回もコードを提供して、問題を調べた人がエラーの内容を特定し、自分で修正する必要がないようにします。

于 2013-07-07T21:11:18.713 に答える
0

この CSS を内部 div に適用できます。

#MiddleColumn {
    width: 50%;
    margin: 0 auto;
}

もちろん、幅を 50% に設定する必要はありません。含まれている div よりも小さい幅は機能します。margin: 0 auto は、実際のセンタリングを行うものです。

IE8+ をターゲットにしている場合は、代わりにこれを使用することをお勧めします。

    #MiddleColumn {
         display: table;
         margin: 0 auto; 
}

内部要素を水平方向に中央に配置し、特定の幅を設定しなくても機能します。

于 2013-07-07T21:11:54.057 に答える