• ベストアンサー

Web表示がずれます(Dreamweaver MX2004)

上記作成ソフトを使用しています. 完成したHPをサイトで確認したら ブラウザのウィンドウ幅を狭めていくと、 (1) ウィンドウサイズにあわせて改行する箇所 (b) そのままの幅の箇所(結果として横スクロールバーが表示される)の2種類の振る舞いが表示されます. TOP_TITLEはFireworksでページ幅一杯に「どーん」と挿入しているので問題ないのですが, メニューボタンが一個一個の画像ファイルを使用しているせいか,幅を狭めると横に6個くらい並んでいるボタンが綺麗に縦に羅列します. TABLEも使用していますが,文章は崩れないのですが,挿入したイメージが崩れます. 原因が良くわかりません.. 詳しい方がいらっしゃったら参考に教えていただけますか?

質問者が選んだベストアンサー

  • ベストアンサー
  • nogutan
  • ベストアンサー率34% (40/116)
回答No.3

みなさんが、書かれているようにソースを見ないとはっきり言えませんが。 テーブルのTH,TR,TDタグの中で%、もしくはなにも書いていないwidthのところがあるのではないでしょうか。 pxで指定されているところは、ウィンドウサイズを変えても小さくならないと。 %や無指定の場合は、ウィンドウサイズに合わせてテーブルのサイズも変わってしまいます。 たぶん上記タグの指定がバラバラなのではないでしょうか。 もしくはテーブルごとに。

sakura1241
質問者

お礼

お返事が遅れました.ありがとうございます. ご回答いただいた皆様のご指摘通り,幅に問題があったようです.(若干その他の部分にもあったのですが) 本当に参考になりました.質問してよかったです. ありがとうございました.

その他の回答 (2)

  • kagamin
  • ベストアンサー率78% (55/70)
回答No.2

ボタンはTOP_TITLEと一緒に書き出ししたんでしょうか?それとも自分で後で並べたのでしょうか。 一緒に書き出しているなら、ずれないと思うんですけど…うーん。 チェック箇所としては… ボタンを並べたトータルの横幅よりテーブル(もしくはセル)が狭くなっていないかどうか。とか… もしボタンのトータル横幅が600ピクセルなら、テーブルもしくはセルの幅が600ピクセル以上で設定されていないとずれますし。 あと、テーブルの幅の指定がされていない場合だとかもずれたと思います。 実際のページを見れば多分分かると思うのですが、質問内容から分かるのは私にはこれぐらいです。すみません.。o○

sakura1241
質問者

お礼

お返事が遅れました.ありがとうございます. >もしボタンのトータル横幅が600ピクセルなら、テーブルもしくはセルの幅が600ピクセル以上で設定されていないとずれますし。 ここら辺でなにやら色々誤差が生じたみたいで..TABLEの幅ってTOTALを考えてやらないとだめですね.. ありがとうございました.

  • s_hukami
  • ベストアンサー率66% (98/148)
回答No.1

具体的なソース(実際のソースでなく構造が判る程度の具体的な例)が無いと回答しづらいのですが、サイトの基本的なレイアウトはTABLEでコーディングされているとみてよろしいでしょうか。 TABLE,TDなどの幅は%で指定したり、数値(px単位)で指定したりしていませんか? また、ナビゲーションは以下のようにTDタグの中に入れているか、否かで表示が変化すると思います。 <table width="680" height="65" border="0" cellspacing="10" cellpadding="0" id="navi"> <tr> <td width="100"><a href="index.html"><img src="images/navi/top.gif" alt="TOP" width="100" height="18" border="0"></a></td> <td width="100"><a href="con01.html"><img src="images/navi/con01.gif" alt="CON01" width="100" height="18" border="0"></a></td> <td width="100"><a href="con02.html"><img src="images/navi/con02.gif" alt="CON02" width="100" height="18" border="0"></a></td> <td width="100"><a href="con03.html"><img src="images/navi/con03.gif" alt="CON03" width="100" height="18" border="0"></a></td> <td width="100"><a href="con04.html"><img src="images/navi/con04.gif" alt="CON04" width="100" height="18" border="0"></a></td> <td width="100"><a href="con05.html"><img src="images/navi/con05.gif" alt="CON05" width="100" height="18" border="0"></a></td> </tr> </table> 該当のHTMLファイルを開いてデザインビューモードで該当のTABLEやDIVなどの表示部分を選択し、コードビューモードで切り替えると、その問題部分のコードが確認できます。 その部分をコピーアンドペーストなどして、公開しても問題のない範囲で教えていただければ、もっと適切な回答ができると思います。

sakura1241
質問者

お礼

ありがとうございます.返事が遅くなりました. 参考にいただいたログ大変勉強になりました. お察しする通りです.直りました..w. 勉強不足で..頑張ります.

関連するQ&A

  • インラインフレームのスクロールについて

    インラインフレームで縦のスクロールだけにして横スクロールを消したいのですが、どうすればできるのでしょうか? 読み込んでくるページはテキストのみです。読み込んできて表示した時にフレームの巾で自動的に改行するようにはできないでしょうか? それとも、読み込むページ側を細長く作っておかないといけなのでしょうか?  フレームのスクロールの設定はautoにしています。 インラインフレームを始めて使用しますので苦戦しています。 宜しくお願いいたします。

  • Firefox 横スクロールバーを表示したい

    当方webサイトを制作しています。 大体完成しており、ブラウザチェックをしている段階なのですが 修正したい箇所がありまして、修正方法をどなたか教えていただけますでしょうか。 横幅を960pxで作ったのですが、よくブラウザのサイズを小さくしたときに横スクロールバーが表示されますよね。 ところがFirefoxで確認したところ、横スクロールバー(縦は出ます)が 表示されず、小さくしたら見えていない部分を表示する手段がありません。 960px以下のモニタのユーザへの対処法として、解像度960px以下の場合は(要はページが画面に収まりきらない場合です) 横スクロールバーで、見えていないところも表示できるようにしたいのです。 現状は以下の通りです。 ・bodyに幅は指定していません(ウィンドウのサイズを960px以上に大きくしたときでもセンターに表示させるため) ・cssで960pxのサイズ指定をしている箇所はあります。 ・IE6では横スクロールが表示されています。 ・html上にwidth960pxのimgを置いてみましたが解決にいたりませんでした。 webで調べてみましても、「スクロールバーを消したい」の情報は あるのですが、「表示させたい」の対処法をみつけることができませんでした。 対処法をご存知の方、どうかよろしくお願いいたします。

  • Dreamweaver8を使ってのホームページの作成に付いてお尋ねしま

    Dreamweaver8を使ってのホームページの作成に付いてお尋ねします。 現在Dreamweaver8を使用してイラストのサイトを作成しています。 ギャラリーのページでイラストをずら~っと並べ、 画像をクリックすると拡大し別窓でウィンドウが開くようにしました。 更に開いたウィンドウには“NEXT”と“BACK”のボタンを付けて、 次のイラストへ同じウィンドウでジャンプしたり、 同様に前のイラストに戻れたりの機能も付けました。 ウィンドウのサイズは各イラストの大きさよりも若干大きい位に設定しています。 しかし、ここで問題が出てきました。イラストは縦表示のものもあれば、横表示もあります。 最初に縦表示のイラストを拡大すると、横表示のイラストにきた時に縦の解像度で表示されてしまいます。 逆に最初に横表示イラストを拡大すると、縦表示のイラストにきた時に横表示の解像度で表示します。 つまり、最初に拡大表示された解像度になってしまうと言うわけなのです。 これを解決する方法はないでしょうか? 最初に縦でも横でもきれいに収まる解像度に設定する、 又はスクロールバーやリサイズハンドルで解決する以外の方法でお願いします。

  • 左に「お気に入り」を表示した時の横スクロールバー

    HB8を使っています。ブラウザはIE7です。 ホームページを作成しているのですが、IEで「お気に入り」を表示すると画面の左に 縦に表示されるのですが、この場合、作ったホームページがその「お気に入り」の幅によって、 改行になったり、画像とテキストがずれたりします。 こうならないように、「お気に入り」の幅が大きくなった際に横スクロールバーを出して、 ホームページが「変形」しないようにするにはどうしたらいいのでしょうか?? よろしくお願いします。

  • Dreamweaver8でページに付けた影の画像がプレビューで表示されない

    他の方の質問&回答を見て、ページに影を付ける方法を知りました (1)Fireworksで幅20ピクセル、縦30ピクセルの影の画像を作りました。 (2)terriroryタグ(幅:770、背景色:白)で囲んだコンテンツの背景画像として、水平位置750ピクセル、垂直位置0、リピートは縦方向に設定してこの画像を挿入しました。 (3)作成画面では、きれいに770ピクセルにおさまり、縦に影らしく表示されました。ステータスバーのterritoryタグを クリックすると影の画像もterritory内に囲まれていることが確認できます。 (4)でもプレビューで見ると影はついていません。 「全てを保存する」してみても変わりません。 他を変更してプレビューしてみるときちんと変更されたものが表示されます。 どこかの設定がおかしいのでしょうか...。 Bodyは背景色を薄い青にしています。幅は自動です。 マージン、余白は0にしています。関係ないですかね。 どなたか教えてください~!おねがいします。

  • iframeのスクロールバー:縦だけを表示したい

    インラインフレームで、縦だけスクロールさせたいのですが、横にもスクロールバーが表示されます。 インラインフレームを入れ込むテーブル幅より、 インラインフレーム自体のテーブル幅は小さくしてあるんですが、なぜなんでしょうか。過去ログをみてみたのですが解決しなかったので新たにアドバイスお願いします。

    • ベストアンサー
    • HTML
  • EXCELでのマウススクロールが突然横になってしまいました。

    EXCEL2003 SP2使用。 今まで、EXCELを使っていて、普通にマウスのスクロールボタンをまわせば、 上下にスクロールしていたのですが・・・ なにをやってしまったのか、突然横、上下に動かしても横スクロールになって しまいました・・・・ スクロールボタンを長押しすると、縦スクロールのボタンらしものがあり、 それをクリックすると、一時的には縦になるのですが、 ちょっとスクロールすると、また横になってしまいます。 マウスの設定などはぜんぜんいじっていないことと、EXCELのウインドウ枠の固定を入れたり解除したりしていたらなってしまったので、 EXCEL上でのなにかの操作だと思うのですが・・・ どなたか、分かる方がいらしたらお願いします。

  • Dreamweaverの操作方法について

    ホームページを作り始めた初心者です。 Dreamweaverの操作方法について教えて下さいますよう御願いいたします。 Dreamweaverの画面を分割画面にしますと、左側にコード画面が表示されます。そのコード画面になぜか横方向に対してスクロールバーが表示されてしまうようになりました。長いコードの場合見えていないコード部分が多くなりまして、ずっと右側にスクロールしないと修正できないなどとても不便に感じています。 Dreamweaveソフトを購入した初期段階では、そのような横方向のスクロールバーは無かったと思いますが…。なんらかのボタンを押してしまい、このような事態になったのではないかと…。 以前のようにコード画面に横方向のスクロールバーが出ないようにする。つまりコード画面の幅に合わせてコードがすべて表示されるようにするにはどうしたらよいか、アドバイスを御願いいたします。 それではよろしくお願いします。

  • htmlタグ打ちホームページで画像表示トラブルが・・・

    こんにちは。 ホームページ作りで困っています。 現在htmlのタグ打ちでホームページを作っていて、画像を何枚か表示しているのですが、その画像がブラウザの表示領域の右端で勝手に改行されてしまいます。 自動改行禁止のタグをうっても解消されません。スクロールはオートに設定してあるのですが、縦スクロールは出るのに横スクロールがでません。 テキストを右端に表示して横スクロールバーを表示しても、元の表示領域の端にあたる位置で勝手に改行されてしまいます。 あの手この手を調べてやってみたのですが、解決できません。 解決方法をご存知の方がみえましたら、ご教授願えませんでしょうか。 宜しくお願い致します。

  • フレーム内のテーブルの表示について。

    先ほど下記で、フレーム内のテーブル表示について質問したのですが、新たな質問が出てしまったので、合わせて改めて質問させて頂きます。 解像度1024×768を基準として、縦に2分割したフレームの片方に、width=100%のテーブルを表示しています。 行数が少なく縦スクロールが出ない状態では、横スクロールがなく表示できるのですが、行数が増え、縦スクロールが出てくると横スクロールも出てしまいます。 縦スクロールが出てくることによって、表示サイズが狭まっているようなのですが、何か回避策がありましたらお教えください。よろしくお願いします。 ちなみに、overflow-x、overflow-yを使用してみましたが、駄目でした。

専門家に質問してみよう