ＦＣ２ブログ ブラウザの違い

質問

FC2のテンプレート[ bluesky ]でブログを書いています。
http://staff.blog1.fc2.com/?style=bluesky​
カスタマイズすることにハマってしまい、素人ながらhtmlやCSSを少しずつ編集していたら、ブラウザにより表示のされ方が変わってきてしまいました。
　IE6やIE7ではきちんと表示されるのに、ネスケやFirefox、Operaでは
下記のブログパーツや本文だけが左のサイドバーの下に表示され、右のサイドバーはちゃんと表示されています。
　本文の上側（左右サイドバーに挟まれたタイトル画の下）に下記のようなブログパーツ（横回転の縦120×横468）を貼ってからです（このブログパーツのhtmlコードを消すと本文がちゃんと表示されますのでコレが原因のようです）
http://amanatu.com/astoretwirlmaker/
　このブログパーツを消さずにIE以外のブラウザでも本文が落ちずに表示できるようにする方法はありますか？

回答No.1

xenotactic · ベストアンサー

このテンプレートを作った職人さんはあまりHTMLやCSSに詳しくなさそうです。

このテンプレートは左サイドバーと記事部分が入っているボックスAを左に寄せ、右サイドバーが入っていえるボックスBを右に寄せることで3カラムを実装しています。

ボックスAの横幅は600pxで固定されています。ボックスAの中でさらに左サイドバーが左に寄せられ、記事部分が右に寄せられています。

ボックスAを「」、ボックスBを『』とすると、
「左サイドバー　記事部分」『右サイドバー』
のような漢字で３カラムになっているのです。

ボックスAの横幅は600px、左サイドバーの横幅は200px、記事部分の横幅は390pxで、左サイドバーと記事部分の間に10pxの余白があいている状態です。

記事部分に横468pxのブログパーツを入れると、78pxはみ出てしまいます。このテンプレートを作った人は、記事部分に関して「はみ出た分」を広げる設定にしているため、ブログパーツを入れたとき記事部分の幅は468pxになります。

すると、記事部分は468px、左サイドバーは200px、足して668pxとなりますが、ボックスAは横幅が600pxのため入りきりません。そのため、記事部分と左サイドバー部分が縦に並ばざるをえなくなってしまったのです。

どうしてもそのブログパーツを貼りたいのでしたら、

#blog {
overflow:hidden;
}

と指定してください。はみ出た部分に関して広げる設定を解除できると思います。まぁつまりは、はみ出た部分が見えなくなるということです。

テンプレート自体の横幅を変えてしまうこともできますが、タイトル部分の画像は今の横幅にあわせて作られているため、かなり不恰好なものになってしまいます。もちろん画像を編集することもできますが、とても面倒くさいです。

アフィリエイトをやりたい場合は、記事部分の横幅が468px以上になっているものをできるだけ選ぶようにしてください。ほとんどのアフィリエイト広告は横幅468pxを基準にしています。もちろん、少し真面目に勉強をした職人さんなら、そんなことは当たり前のように知っているので、記事部分の横幅を468px以上にしていますが。

お礼

無事解決いたしました。
今度テンプレートを変える時の参考にさせて頂きます

回答No.2

noname#57571

この種の質問は回答者もテンプレートのソースを見て答えるわけですが、カスタマイズされている場合は、直接そのブログを表示したりソースを閲覧しないと的確な回答ができない場合があります。しかるに、教えて！gooでは個人URLの開示は禁止事項ですので、FC2サポート掲示板でお尋ねになるべきだと思います。

ブラウザによる表示の違い
http://blog.fc2.com/forum/viewtopic.php?t=19926

お礼

無事解決いたしました。
FC2サポート掲示板で質問することにします。