長い記事タイトルが重なって改行される

記事タイトルが長くなり、改行されると、デフォルトのままのテンプレートだと、このように重なってしまいます。

テンプレートを見てみると

   1:  .post h3 {

   2:      margin: 0 0 5px;

   3:      padding-bottom:6px;

   4:          border-bottom:1px solid #dbe1e6;

   5:  }

   6:  .post h3 a, #content h1 a:visited {

   7:      color: #000;

   8:          font-family:arial, tahoma,  Sans-Serif;

   9:      font-size: 1.8em;

  10:      font-weight: normal;

  11:      margin: 0 0 5px;

  12:      padding: 0;

  13:          

  14:  }

  15:  .post h3 a:hover {

  16:      color: #000;

  17:      text-decoration: none;

  18:  }

  19:  .post-body {

  20:          text-align:justify;

  21:      margin: 2em 0 .5em;

  22:      line-height: 1.6em;

  23:  }

  24:   

  25:  .post-body blockquote {

  26:      line-height: 1.3em;

  27:  }

となっており、フォントサイズしか指定されてないし、しかもそれがデカ文字の1.8em

なので、行間指定をしてやると（青色の部分）、こうなって、文字が重ならなくなる。。。

   1:  .post h3 {

   2:      margin: 0 0 5px;

   3:      padding-bottom:6px;

   4:          border-bottom:1px solid #dbe1e6;

   5:  }

   6:  .post h3 a, #content h1 a:visited {

   7:      color: #000;

   8:          font-family:arial, tahoma,  Sans-Serif;

   9:      font-size: 1.3em;(←おまけに、フォントサイズも小さく)

  10:      line-height: 1.1em;

  11:      font-weight: normal;

  12:      margin: 0 0 5px;

  13:      padding: 0;

  14:          

  15:  }

  16:  .post h3 a:hover {

  17:      color: #000;

  18:      text-decoration: none;

  19:  }

  20:  .post-body {

  21:          text-align:justify;

  22:      margin: 2em 0 .5em;

  23:      line-height: 1.6em;

  24:  }

これで、XP環境のＩＥ８でも文字が重ならずに表示されるのでした。