スタイルシートレイアウトでのHP作成におけるレイアウト崩れの原因と修正方法

このQ&Aのポイント
  • スタイルシートレイアウトでHPを作成したところ、ブラウザでは正常に表示されるが、ホームページ作成ソフトの画面ではレイアウトが崩れている問題が発生した。
  • 使用しているソフトウェアの違いによるレイアウトの崩れやスタイルシートの設定の不備が原因と考えられる。
  • 解決方法として、使用しているソフトウェアのバージョンや設定の確認、スタイルシートの修正を行うことが推奨される。
回答を見る
  • ベストアンサー

スタイルシートレイアウトで・・

初めまして。よろしくお願い致します。 先日、知人のHPをテーブルレイアウトからスタイルシートレイアウトで作り直しました。すると、ブラウザでは問題なく見れるのですが、 ホームページ作成ソフトの画面で見ると、大きくレイアウトが崩れています。文字の大きさなどはスタイルシートで設定したとおりです。 ちなみに、元々のHP(テーブルレイアウト)はドリームウィーバー4日本語版というもので作られており、私が作成したものではありません。それを私が、ホームページビルダー10を使って、スタイルシートレイアウトに書き直しました。 いろんなソフトで確認してみると『ビルダー10』のページ編集の画面では、レイアウトの崩れはありません。『ビルダー9』のページ編集の画面でみると右と左に回りこみを指定したのに、文字などが重なってしまいます。 また、『ドリームウィーバー4日本語版』のデザインビュー画面だと文字の大きさ以外のスタイルシートは、全く無視され大幅に崩れてしまって、回り込みなどは全く無視され、下へ下へ書き込んだHTMLソースどおりに表示されます。 『ドーリームウィーバーMX2004』だと左に回り込みを指定した部分だけが崩れて、その部分が左の最下部(フッターよりも下)になっています。 ソフトが違うから崩れるのでしょうか?それともスタイルシートの設定がおかしいのでしょうか?何から修正すればいいのかわかりません。 当方、HP歴はビルダーで1年ほどほぼ独学の初心者です。 うまく説明できなくて、申し訳ありませんがよろしくお願いします。

  • otpp
  • お礼率90% (18/20)

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

  • ベストアンサー
  • papipu01
  • ベストアンサー率40% (19/47)
回答No.1

まず、ホームページ作成ソフトの発売時期や、ホームページの制作時期によって、そのソフトやホームページがどのブラウザを意識しているかが異なります。 古いバージョンでは、当然IE7は意識されてませんし、例えばSPへの対応も異なります。 今回のあなたのトラブルは恐らく、フロートレイアウトの場合に、IE6ではフロートとマージンを併用した場合には、マージンが2倍になるバグなどがありますので、まずはリンク先を参照してください。 また、IE6とIE7では、height等の処理が違います。 まずは、フロートレイアウトのCSSの解説本か何かを読むと良いでしょう。

参考URL:
http://stopnlisten.no.land.to/2007/01/css10.html
otpp
質問者

お礼

お礼が遅くなり申し訳ございませんでした。 まだ、うまく調整はできていませんが、 教えて頂いたURLを参考にもう少し勉強してみます。 ありがとうございました。

関連するQ&A

  • ドリームウィーバーを使ったスタイルシートの外部化について・・・

    スタイルシート初心者です。 ドリームウィーバーでサイトを構築中なのですが、スタイルシートの外部化についてお尋ねしたいことがあります。 スタイルシートを外部化することでサイトの構造を軽くしたいのですが、ドリームウィーバーの編集画面の下のプロパティにある文字サイズの変更、色などを指定しながら文を作っていくと、どんどんhtmlソースの上の方にスタイルが追加されてしまいます・・・ これではファイルが重くなるばかりなのですが、スタイルシートを外部化して、全てそこから読み出すようにするにはどうすれば宜しいでしょうか? この状態では各ページごとにスタイルシートがhtml上にでてきてしまいます。 スタイルシートを一括管理したいのです。 まだまだ初心者の為わかりやすいようにどうかよろしくお願い致します。

  • ホームページビルダーを使ってスタイルシートでレイアウトがしたいんですが…。

    ホームページビルダーを使って スタイルシートでレイアウト(表、テーブルを使わないで) したいんですが…。 その様な方法をアドバイスしてくれているサイトや書籍 その他参考になるものありませんか? テーブルレイアウトはSEO的にお勧めでは無いと聞いて できればと考えています。

  • スタイルシートの専門書

    お世話になります。 現在ドリームウィーバー4を使っています。スタイルシートを勉強中で、ネットでも色々検索したりして、調べているのですが、なかなかわかりにくいこともあり、専門書を手元に1冊置きたいなと思っています。 ドリームウィーバー4を使ううえで、オススメの専門書を教えてください。 スタイルシートについては初心者です。 宜しくお願いします。

  • スタイルシートレイアウトで

    スタイルシートで、レイアウトしてホームページをつくりました。 しかし、スタイルシートで位置を移動させて作ったせいか、下のほうにぽっこり空白ができてしまいました。 これをなくす方法というものは存在するのでしょうか?

    • ベストアンサー
    • HTML
  • スタイルシートを学ぶのにおすすめの本

    HP作成でスタイルシートを取り入れていきたいと思っています。 スタイルシートを基本から勉強するのにお勧めの本がありましたら教えてください。 テーブルばかりのレイアウトから脱出したいと思っているので、その辺りが分かりやすく学べる本を購入したいと思っています。 ちなみに現在はホームページビルダーを使用していますが、HTMLの基礎知識はあります。

  • スタイルシートについて

    ホームページビルダー11を使って、ホームページ作成途中なのですが、メニューについて悩んでいます。 http://home.isle.ne.jp/index.html 上記HPでは一番上のメニュー、ロゴ等がどのページからアクセスしても常に固定されています。 これと同じ事をしたいのですが、スタイルシートを利用すれば解決できるのでしょうか?  *フレームの使用考えていません。 商用としてホームページを作成するため、固定部分に営業日カレンダー等を挿入したいのです。 そうすると少なくとも1ヶ月に1回は固定部分を更新しなくてはなりません。ページ数は100以上あるので1個1個更新することは避けたいです。 この問題をスタイルシートを用いれば一括編集可能でしょうか? それともスタイルシートはあくまでスタイルを一括編集出来るだけであって、文字(テキスト)までは一括編集できないのでしょうか?

  • スタイルシートの変更について

    ビルダーのテンプレートを使ってWebページを作成しています。 デザインは気に入っているのですが、問題があります。テキストを入力すると編集画面では一行に30文字程度入っているのですが、実際(プレビュー)には15文字くらいで改行されてしまいます。画面表示の状態(全画面等)は関係ありません。 スタイルシートが設定されているので、スタイルのどこかの設定を変更すればいいと思うのですが、どのタグがそれにあたるか分かりません。教えてください。 もしかするとスタイルのとことは関係ないのかもしれません。あわせてよろしくお願いします。

  • スタイルシートで文字の大きさを

    HPビルダーを使っているのですが全てのページに同じ大きさの文字にしたいのですがスタイルシートでどのように設定したら良いのでしょうか?? サイズは-1にしたいです。 よろしくお願いします

  • スタイルシートについて

    HPの画面にテーブルを3つ配置することを考えています。 (1)(3) ←数字がそれぞれテーブルの位置関係を示ています (2)(3)   ((3)は一つのテーブルです。) 最初は(1)(3)のテーブルを横につなげることを考えましたが (1)(3)の縦の長さが違うデザインのためできませんでした。 横につなげると、テーブルの縦の長さが長いほうに そろってしまうのです。 そこでスタイルシートを使用すればできるのではないかと 思い、(3)をmarginでTOPを10ptにしたのですが そうすると(2)のテーブルの真下にきてしまいました。 スタイルシートを使用してもしなくてもいいので 方法を教えて下さい。よろしくお願い致します。

    • ベストアンサー
    • HTML
  • スタイルシートが反映されません

    スタイルシートをアップしたのですが反映されません。 ドリームウィーバー上では表示されるのですが、原因がわからず困っています。 前回までは表示されたのですが、更新作業を行ったら反映されなくなりました。 何か考えられる原因がありますでしょうか?

    • 締切済み
    • CSS