3 years前の投稿 #
はじめまして、どうぞよろしくお願いします。
Sustainableというテーマを利用しているのですが、記事内でhtmlタグを使用すると表示が崩れる場合があって困っています。
具体的には、<hr>などを任意の箇所に記述すると、それ以降フォントのサイズやカラーの指定が無視されてしまいます。FireFox3.0.1、IE6.0.2、Sleipnir2.8.0で表示させてみましたが、どのブラウザでも再現されました。
（今は使っていませんが、2.5.1で使用していた別のテーマ（BlueBox）でも同様の現象がありました。）
CSSを眺めていて、どうも各クラス内でスタイルが定義されていないタグが入るとダメらしい、というところまでは気づいたのですが、そこから先がさっぱりわからない状態です。どなたかご教授ください。
3 years前の投稿 #
ひょっとすると、HTML の記述がまずい可能性があります。
HTML の要素は、大きく分けてインライン要素とブロック要素との2種類があります。まず、インライン要素の中にブロック要素は入れられないという大原則があります。ブロック要素は、その中にインライン要素またはブロック要素を入れられますが、要素によってはインライン要素しかダメな場合があります。
で、<hr />, <div>, などはブロック要素であり、<span>, <font>, <strong>, <em> などはインライン要素です。ちなみに、WordPress は HTML じゃなくて XHTML を出力するので <hr /> が正しいです (<hr> だと文法違反です)。
もし、<font color="red">なんちゃら<hr />ふがふが</font> という記述をしていると、これはインライン要素の中にブロック要素が入ってしまっているため、WordPress が自動的に <font color="red">なんちゃら</font><hr /><font>ふがふが</font> のように修正してしまいます (実際には div または p 要素も補完されるはずです)。
とりあえず、Default テーマに切り替えてみて、それで現象が発生するならば、XHTML の記述がよくないと考えてください。テーマを切り替えると直るならば、テーマが悪いと思います。
3 years前の投稿 #
lilyfanさん、ありがとうございます。
defaultテーマでは問題がありませんでしたので、教えていただいた内容を元にCSSとにらめっこしてたのですが、解決しました！
CSS内で、記事内の装飾を指定していたidが
#main_content { ……
というもの（ボックス幅とフロート属性）と、
#main_content P{ ……
というもの（フォントサイズとline-height、マージン）の二つに分かれていたので、フォントサイズとline-height、あとついでにcolorを#main_contentにまとめてみたところ、ブロック要素の後でもCSSで指定したとおりに出力されました。
デザイン的に気に入っていたテーマでしたので、問題なく使えるようになってほっとしました。
どうもありがとうございました。
3 years前の投稿 #
なるほど。純粋に CSS の問題だったんですね。HTML の記述が悪いわけではなくてよかったです。
ひょっとすると、P が大文字だからダメだったりするかもしれません。これでは P 要素に対する指定になってしまい、p 要素に対する指定になりませんから (「P 要素」なんてものは存在しません)。
ログイン しなければ投稿できません。
