Opera でも長いサブタイトルを最後まで表示できるようにする

☆

サブタイトルには、あまり長い文字を入れない方がいいのですが、ココログの場合は、 テンプレートを自由にいじれないので、必ず読んで欲しいメッセージを目立つところに入れようとすると、 サブタイトルに入れたくなる気持ちもわかります。

ウチのブログは、HTMLとかソースを基本的にいじれないココログである関係上、サブタイトル欄を便宜上告知欄として使用しており、結構長い告知をしているのですが、その告知欄として使用しているサブタイトル欄が途中までしか表示されない、という感じで。

bublog: Operaだと、ココログがちゃんと表示されない！

実際に、Opera で見てみました。

これはスタイルシートで解決できますね。IE はこのままでいいので、IE には適用されず、Mozilla系 や Opera には適用される方法を使います。

どうやるのかというと。スタイルシートに、以下の内容を追加すれば解決します。

#container > #banner {
  height: 150px;
}

div#banner > h1 {
  font-size: 1.5em;
}
div#banner > h2 {
  padding-top: 10px;
  font-size: 0.8em;
  line-height: 100%;
  height: 40px;
  padding-bottom: 20px;
}

「>」を使うのがポイント。「>」を入れると IE では無視されます。Opera にはちゃんと適用されて、 以下のような見え方になります。

(スクリーンショットを貼るのがまずかったら言ってきて下さい > bubunさん)

IE ではちゃんと見えるのに Opera で見ると変だ、という場合、この方法が応用できます。