No.1
- 回答日時:
具体的にソースが無いのでなんともですが
一応参考として
ブロックレベル要素をセンタリングする方法 - Web標準普及プロジェクト
http://www.mozilla.gr.jp/standards/webtips0004.h …
参考URL:http://www.mozilla.gr.jp/standards/webtips0004.h …
No.2ベストアンサー
- 回答日時:
まぁ、MozillaとIEで表示が違えば大抵IEのバグですが、IEが正解でMozillaが違ってる場合もあります。
今回の件は具体的にどんなんだかわからないので分かりません。
で、基本的なCSSでのセンタリングですが、例えばブロック要素を真ん中に持ってくる場合は、その真ん中に持ってきたいブロック要素自身のマージンでセンタリングします。
例えば、
<div style="width:100px; margin:0 auto 0 auto;">まんなかです</div>
とすると、こいつは親要素に対して左右均等のマージンを取る。つまりセンタリングされます。
ブロック要素の中のテキストやインライン要素をセンタリングするにはtext-alignを使います。
<div style="width:100px; text-align:center;">まんなかです</div>
それと、注意したいのは、一行目の文頭に<!DOCTYPE~>を書かないとIEは互換モードでレンダリングしだしますので、CSS解釈も(ますます)変になりますのでご注意を。
こんな感じで。
No.1の方のサイト、参考になりますよ。私も昔これ見て勉強しました(笑)。
pingu98さん有難うございます。
><div style="width:100px; margin:0 auto 0 auto;">まんなかです</div>
とすると、こいつは親要素に対して左右均等のマージンを取る。つまりセンタリングされます。
私ははじめて知りました。有難うございます。
>それと、注意したいのは、一行目の文頭に<!DOCTYPE~>を書かないとIEは互換モードでレンダリングしだしますので、CSS解釈も(ますます)変になりますのでご注意を。
やはりDOCTYPEはきちんと記載しなければいけないのですね。
>No.1の方のサイト、参考になりますよ。私も昔これ見て勉強しました(笑)。
私も参考にさせていただきました。
No.3
- 回答日時:
No.2の方の言う通りmarginの左右にautoを設定するとその親要素に対してセンターになります。
ただし、IE5.5やIE5ではautoが対応になっていないので、autoを設定したdiv自体にtext-align:leftを付け加え、さらにその親要素にtext-align:centerを設定すれば完璧です。
ao_さん有難うございます。
>ただし、IE5.5やIE5ではautoが対応になっていないので、autoを設定したdiv自体にtext-align:leftを付け加え、さらにその親要素にtext-align:centerを設定すれば完璧です。
なるほど、バージョンによって対応状況がかなり違うんですね。
何かキチンとした基準が全てのブラウザに統一して適用できないものなのでしょうか・・・?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- JavaScript htmlとcssで分数を表示後、分数の右側に文書を書きたい 1 2022/04/28 10:09
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS img と p を縦中央に配置したいのですがうまくいきません。 2 2023/01/12 14:38
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
1から100までの自然数のうち、2...
-
超音波で洗脳。
-
CSSのセレクタに指定するbodyと...
-
smallにtext-allignが効かない
-
「諸要素」とはどういう意味で...
-
【ヒトの神秘】美男美女から何...
-
aの中にspan
-
リンク付き画像を右よりに表示...
-
aタグ 中央寄せ
-
cssで好きな位置に好きなボック...
-
<div>でレイアウトすると上下に...
-
html5で右揃え、方法は?
-
初歩的な質問です。<div>のwidt...
-
あるタグが反応しません...
-
HTMLで <p>~</p>内で2回以...
-
border: noneでボタンの境界線...
-
<object>
-
<br />と<br>は同じ意味ですか?
-
Bootstrap レスポンシブ textarea
-
imgタグをそのまま使うことは正...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
【ヒトの神秘】美男美女から何...
-
超音波で洗脳。
-
質問1.
-
smallにtext-allignが効かない
-
含む含まないという概念自体の...
-
NからZへの全単射を具体的に構...
-
角丸画像の背景色を透明にした...
-
タグは大文字と小文字どちらが...
-
改行ほどは行かないけど、若干...
-
2個のFormを横並びにしたい
-
「諸要素」とはどういう意味で...
-
input type="hidden"で取得した...
-
CSS:overflow要素の印刷について
-
textareaの幅を画面と合わせたい
-
親要素・子要素
-
テキストボックスの中にリンク...
-
emとstrongの反対
-
cssのdisplay:block
-
border: noneでボタンの境界線...
-
tdに対してmin-heightの定義、...
おすすめ情報