- 締切済み
ホームページが中央に位置しません。
先日このようなサイトを作成しました。 http://synergy-ep.co.jp/ Ｂ5のノートパソコンで見ると左に寄ってしまいます。 Ｂ4のノートパソコンでは中央に位置し問題は ありませんでしたが、何がおかしいのでしょうか？ ソフトはドリームウィーバーを使用しました。 初心者ゆえ、ご教授宜しくお願いいたします。
- marino03
- お礼率15% (7/46)
- Windows XP
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
みんなの回答
IEはhtml表記に多少の間違いがあっても（タグの閉じ忘れ等）表示されるようです。 ドリームウィーバーで表示されていないということですので、タグ表記間違いがあるのは確かです。 CSSの部分ですと h2 { font-size: 12px; font-weight: lighter; line-height: 1.5; } これは「body」指定でいいのではないでしょうか。 body { font-size: 12px; font-weight: lighter; line-height: 1.5; } と表記して<h2>と最後の</h2>は取ります。<h2>表記は意味合いが違うと思います。 他には .top{ width: 680px; height: 1140px; border: solid #bebebe 2px; margin-left: auto; margin-right: auto; background-color : #ffffff ; ここでheight: 1140px;を指定してしまっているので、最後がごちゃごちゃしてしまっているのでは？ この指定は少し違うような気がします。当方でしたら下記のように記入します。（高さを限定しません） CSS例 * {margin:0 ; padding:0 ;} body { margin:0px; background-color: #f8ffff; background-image: url("050419_01_back.gif"); background-repeat: repeat; font-size: 12px; font-weight: lighter; line-height: 1.5; } #my_body { margin:0 auto ; width:680px ;/*デフォルトでは677pxでしたが他に679px指定のboxがあったため*/ background-color:#ffffff; border: solid #bebebe 2px; } HTML例 <body>（BACKGROUND="050419_01_back.gif"は取ります） <div id="my_body"> <div class="box"> <div class="base"> ・ ・ ・ ・ </div> </div> </div> </body> ※<SPAN STYLE="position: absolute; top: 2px; left: 186px; height: 1000px; width: 660px;">は削除します。 他にはCSSの中で「.box-ko6」の後に「}」が二重になっていました。 position: absoluteを多用しすぎていて崩れているのかもしれません。 こちらで確認できるのは今はこれくらいになってしまいます。申し訳ありません。
作られたサイト（企業）の宣伝ではないことを信じましてのお返事です。 中央に位置していないのは恐らく <SPAN STYLE="position: absolute; top: 2px; left: 186px; height: 1000px; width: 660px;"> の部分が関係しているのではないでしょうか。（専門家ではないのですみません） position指定は下記を参考にしてください。 http://www.seo-equation.com/html/css/position http://www.tohoho-web.com/css/reference.htm#position http://www.htmq.com/style/position.shtml Firefoxで見てみたのですが最後の辺りのレイアウトがおかしく 画像と画像、文字と文字が重なっていてとても見づらいです。 htmlタグ表記やCSS表記も間違っているところがあります。（ひとつひとつ説明できませんが）
お礼
＞作られたサイト（企業）の宣伝ではないことを信じましてのお返事です。 お答え頂き、誠にありがとうございます。 上記のようにとらえられても仕方ありませんよね。 それを踏まえての苦渋の決断で投稿致しました。 ソースを見て分かると思いますが、初心者です。 ＞Firefoxで見てみたのですが最後の辺りのレイアウトがおかしく ＞画像と画像、文字と文字が重なっていてとても見づらいです。 ＞htmlタグ表記やCSS表記も間違っているところがあります。（ひとつ＞ひとつ説明できませんが） 確認をしてみます。 ご連絡を頂き、誠にありがとうございました。
補足
ところで、IEで見るとイメージどおりなのですが、 Firefoxで見るとどうしてレイアウトが崩れてしまうのでしょうか・・。 ドリームウィーバーの作成画面でもレイアウトが崩れていたままでしたがIEでみると問題がなかったのでそのまま放置していた。 よくないのでしょうか。
お礼
なんとか真ん中に寄せることが出来ました。 ありがとうございます。 FIREFOXでの表示ですが、どうしてレイアウトが崩れるのか がわからないので根気よく考えていきたいと思います。 もし、おわかりになりましたら、お手数ですが、ご教授 いただければ幸いです。
補足
本当に親切すぎる説明ありがとうございます。 まだ試しておりませんが、時間がある時に試してみます。 感謝感激です。 改めてありがとうございます。 評価は改めてつけさせて頂きますので もう少々お待ち下さい。