人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ブログ(MovableType)のレイアウトが崩れて困っています。
特定のカテゴリーでのみ起こっているようです。
また、IE6、Firefoxで崩れる条件が違うようです。

http://blog.histyle.jp/

IE6では、
おしゃれカンケイというカテゴリーで右ブロックが左ブロックのずーっと下へ移動しています。
モブログ刑事というカテゴリーでは右ブロックが中央ブロックのずーっと下へ移動しています。

また、Firefoxでは、
モブログ刑事というカテゴリーでエラーが出て、なんだか変な表記になってしまいます。

お手数ですが、教えていただけると助かります。

●質問者: GUCCI
●カテゴリ:インターネット ウェブ制作
✍キーワード:firefox IE6 MovableType おしゃれカンケイ エラー
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● komorebi
●20ポイント

レイアウトが崩れるのは、CSSの解釈がFirefoxとIEで違うからです。

IEのバージョンだけでも解釈がまったく違います。

どちらかと言えば、IEのCSS解釈がおかし過ぎる、という方が伝わりますでしょうか。

正確には、余白である「margin」や「padding」と、横幅「width」との間で解釈が違うため、足した数字が変わってしまう原因です。

#基礎編2 ボックスモデルとDOCTYPEスイッチ

カテゴリーに崩れは、

?
の中に、以下のAとBが入っているようです。

A:

?

B:

?

AとBの横幅の合計が、

?

の横幅を超えていませんか?

それと、XHTMLの記述がHTMLになっている箇所があるようです。

まずは(X)HTMLの仕様から覚えた方はよろしいかもしれません。

◎質問者からの返答

回答ありがとうございます。

なるほど、参考になります。

もう少し、具体的にどこをどう直せばいいか教えていただけたら助かります。

他にも回答お待ちしております。


2 ● 狂人日記
●10ポイント

ポイントいらないっす。

ブログっちゅーのは、どうも、レイアウトにこだわるよりは、

更新しやすさに着目して使うのが良いんじゃないか、と個人的には感じています。

レイアウトに凝るんなら、Webページを作る方が、ずっと自分好みのを簡単に作れて、

良いと思いますけどね。

HPビルダーとかを使うんなら、そんなに難しい作業じゃないですよ。

ブログのレイアウトに凝る方が、ずっと難しいと思う。

http://www.imb.me-h.ne.jp/~kihara/

◎質問者からの返答

回答ありがとうございます。

それもそうなんですよね。

しかし、これだけ長く続けてきたらそれなりに思いいれもあるわけで・・・。

ちなみに、ブログのレイアウトに拘っている訳ではなく、なぜか突然崩れたので困っているのです。


3 ● nana109
●20ポイント

ただいまIE6で見ました。

全く異常なしでしたが・・

どこがおかしいのでしょうか。

おっしゃるような症状は全然ありませんでしたよ。

http://blog.histyle.jp/

◎質問者からの返答

回答ありがとうございます。

おお!一時的なものだったのかと思い私も見ましたが、やはり症状がでます。

PCに依存するのかと、他のPCでも見ましたが、やはり症状がでます。

カテゴリーを選んだ場合に出るのです。

TOPページは大丈夫なのです。


4 ● uk999
●40ポイント ベストアンサー

http://www.htmq.com/style/word-break.shtml

おそらくURLなどの"<a>"タグで囲まれた文章が本文の横幅をオーバーしていたのが原因だと思います。

エントリーを増やしていくうちに直るとは思いますが、問題の記事を表示すると同じように右のカラムが落ちてしまいます。

"word-break:break-all;"

これをCSSの"body"もしくは"a"の要素に追加してみてはいかがですか?

IEでのみ長い文章を強制的に折り返すようになるはずです。

firefoxのほうはちょっとわかんないっす。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ