テキストエディターの中には正しく表示されるのに、プレビューと実際のコンテンツでは、上に歌詞をひらがなで書いて、その下に拍子カウントを全角数字で書いて、３拍子と４拍子の違いを表示しているのにもかかわらずに、数字の部分がずれてしまいます。
<!--
<pre>
│ おてーてー │ つないでー │
１２ ３４ １２ ３４
</pre>
-->
童謡「くつが鳴る」でしたらば、どなたが見ても、歌詞と拍子カウント数字との位置関連がずれないで正しく表示された時のイメージ図がわかりやすいと思いますのでここに書きました。
実際の書きたい画面の「３拍子と４拍子の変拍子」についても、リンク貼りますので見てみてください。
↓テスト表示のコンテンツ画面です。
http://landf431.blog.fc2.com/blog-entry-17.html
preタグは、ファックスと同じように、書いた文字全体が、文字データじゃなくて、１枚の図画として表示されるものと理解しております。
文字じゃないはずなのに、どうしてくずれて表示されてしまうのでしょうか？
私はPC歴２年１ヶ月の初心者ですので、幼稚なお願いで申しわけありませんが
ご指導ください。
Win7, 64bit, IE9 を用いていますが、エクスプローラ9 でもブログ記入には不都合はないと思っているのですが～？
ここのコミュニティフォーラムに、このような内容を投稿してもよろしいのでしょうか？
Q&A および SAQ の検索はして見ました。
このコミュニティにご参加頂くと、コメントの書き込みができます
1件中、1～1件表示
margin: 1em auto;
padding: 0.5em;
border: 1px solid;
font-family: sans-serif;
overflow: auto;
width: 90%;
}
CSS に ↑ のような設定が入っています。
等幅にしたいのであれば、font-family: の行を 以下のように変更すると良いと思います。
font-family: monospace;