ホームページの表示について

質問

今現在ビルダー11でホームページを作っているのですが、標準配置モード、スタイリッシュエフェクトを使って作ったとき、表示が左に詰まります。
http://www.sakura-surf.jp/　　←例えばこんな感じです。

http://www.hiragamasahiko.jp/やhttp://www.tanakaseimen.com/のように
きちんと中央に表示させる方法を教えてください。

スタイリッシュエフェクトを使用しない場合はなんとかうまく表示できそうですが、スタイリッシュエフェクトを使いたいと考えております。

またこの現象はビルダーの画面では、白い余白もできず画面いっぱいに、しかも中央に表示されるのに、ブラウザ（ＩＥ）で確認すると左によってしまいます。

あと思ったんですけどビルダーの製作画面とブラウザで表示させる場合の画面のサイズって違いますよね？（ブラウザの画面の方が大きいですよね）

説明が分かりづらくて申し訳ありませんがよろしくお願いします。長文失礼しました。

回答No.1

crepon133 · ベストアンサー

添付されるCSSファイルを編集してください。
追加
body {
text-align:center;
margin:0px;
padding:0px;
}
修正
.hpb-main {
text-align:left;
margin-left:auto;
margin-right:auto;
}

お礼

すごいです・・。ちょっと感動しました。
CSSファイルすら知りませんでした。
ありがとうございます。

それで申し訳ありませんが、もう少しだけ詳しく教えてほしいのですが、
追加の方はただ単に一番下に追加すればいいんですよね？
それで表示はセンターになりました。

修正はどこを修正すればよろしいのでしょうか？
.hdp-はたくさんありましたが。
また
.hpb-main {
text-align:left;
margin-left:auto;
margin-right:auto;
}
は何を意味しているのでしょうか？

お手数ですが教えていただければ幸いです。

回答No.2

crepon133

追加の追加
body {
は全体に影響するので、できるだけ先頭に記述した方が分かりやすいと思います。
hpb-main は一番外側のテーブル（表）に関する指定です。
そのままだと
/*-------------------- maintable --------------------*/
.hpb-main {
}
となっていると思うので、そこを
/*-------------------- maintable --------------------*/
.hpb-main {
text-align:left;
margin-left:auto;
margin-right:auto;
padding:0px;
}
と書き換え、テーブル（表）をセンターに配置します。

body の text-align:center;
と、テーブル（表）の
margin-left:auto;
margin-right:auto;
は、どちらも中央に配置するものですが、
ブラウザの互換性を考慮して両方記述しています。

お礼

親切かつ、迅速な対応ありがとうございました。