問題タブ [centering]

ブラウザー ウィンドウの中央に div (#box) を配置しています。これは、縦 600 ピクセル以上のブラウザーにとってはグルーヴィーです。ウィンドウがそれよりも小さい場合、div の上部にあるコンテンツが切り取られ、スクロール バーは (スクロール バーを下に引っ張ったときに) ページを上にスクロールするだけなので、上端の上に隠れているものを見ることは不可能です。スクロールバーが一番上の位置にある場合でもウィンドウ。

div を中央に配置する方法は次のとおりです。小さなブラウザー ウィンドウで div の上部が切り取られる理由がわかります。

(最も幅の広い画面でも動作するアニメーションに対応できるように、幅は非常に広いです。幅は問題ではありません。)

参照するページは次のとおりです: http://ianmartinphotography.com/test-site/
そして私のCSS: http://ianmartinphotography.com/test-site/css/basic.css

これは、私の CSS スタイル シートで簡単に修正できますが、600px より大きいモニターと 600px より小さいモニターの両方で使用できないようです。

では、ブラウザー ウィンドウのサイズを検出して、2 つの異なる CSS スタイル シートのいずれかを選択するにはどうすればよいでしょうか。小さな窓用に 1 つ、大きな窓用に 1 つ？私のためにこれを行うjqueryスクリプトはありますか?

または、小さなブラウザー ウィンドウで div の上部にアクセスできるように、スクロールを許可するCSS を使用してブラウザー ウィンドウの中央に div の中心を作成する別の方法はありますか?

ご感想ありがとうございます！

既知の高さの div 内で未知の高さのテキストを垂直方向に中央揃えしようとしています。css オプションを試してみましたが、display: table-cellうまくいかなかったので、jQuery を使用して高さを検出し、必要に応じて上マージンを適用してセンタリングを実現しています。これは、何かを調整する必要がある場合に機能します。しかし、それを再調整してトップマージンをゼロにすることはできません。

これは私の機能です：

変数 trendMargin は常に 0 または 12 です。ゼロの場合、最初はすべてが適切に設定されています。次に、12 の場合、上余白を適切に設定します。しかし、marginTop が 0 の次の項目に到達すると、元の場所に戻されません。このものを垂直方向に揃えるにはどうすればよいですか? 垂直方向のセンタリングがこれほど難しいとは思えません...

http://led.dlugosz.com/でページを表示できます。^※ 「ギャラリー」セクションを左寄せではなく、利用可能なスペースの中央に配置したい。</sup>

ということで、ルール追加

そして、それはうまく機能しているように見えました。しかし、別のページで同じことを行ったところ、まったく機能せず、違いがわかりません。次に、このページをもう少しいじってみると、さまざまなウィンドウ幅で機能する、機能しない、または非常に奇妙なことがわかります。何が起きてる？さらに言えば、どうすればこの効果を達成できますか?

※ページを更新し、最終的に削除しました。

私は現在900pxの固定幅のdivを持っています。
幅が950pxに固定された子iframeを追加し、中央に完全に配置したいと思います。
どうすればそれができますか？

ありがとう。

私は持っています:私はいくつかのウェブページを両方ともこのアウトラインで持っています:

CSSで：

問題:すべてのページが短いため、スクロール バーは表示されませんが、1 ページだけ長いため、右側に垂直スクロール バーが表示されます。この 2 ページ目により、コンテナーが少しだけ (左に) シフトされます。

私が理解している一般的な解決策は、スクロールバーをすべてのページに表示することですが、それは多くのページのうちの1ページにすぎないため、本当に避けたいと思っています。

質問:すべてのページにスクロールバーを表示せずにコンテナを中央に配置したままコンテナを移動しないようにする方法はありますか?

2 つの要素を div または他の要素内に並べて配置しようとしているため、2 つの要素の両方が常にページの中央に配置されます。

ここにキャッチがあります...固定幅は使用できません.javascriptによって動的に生成されます。他の投稿を読むと、幅が固定されていないとこれは不可能であるように思われますが、同じ結果を達成するための他のアイデアがあるかどうかを確認したかったのです。

HTML:

CSS:

ULをDIVの中心に置くことができないようです。

私は次のCSSを持っています：

簡単なことだと思いますが、うまく組み合わせられないようです。

OMG、本当に私はここに何千回も来ています。この回答を抜粋します。これほど簡単なことをするのがどれほど難しいか信じられません。

ラッパーがブラウザーの真ん中にある必要があります。中のテキストの長さや div の量は関係ありません。一体どうやってこれを行うのですか？私はここでびっくりしています。私はCSSがそれほど苦手ではありません。これをグーグルで検索すると、2005年のフォーラムの投稿が表示されます。または、幅が指定されているために回答が見つかるので、それは単なるごまかしです。

毛が抜ける！

CSS はここには入れません。機能していないだけなので、意味がありません。

ありがとう。

spanaを a の中央に配置するためのこの JavaScript がありdivます。

オブジェクトにメソッド css がないというエラーが表示され続けます。何が間違っているのですか？

すべての HTML と CSS はこのフィドルにあります (まったく同じエラーが発生します: http://jsfiddle.net/chromedude/s6WQD/

この例では、画像は中央に配置されていません。なんで？私のブラウザは、IEではなく、Windows 7のGoogle Chrome v10です。