2009年10月07日

ブログでAAをキレイに表示させる方法を考える。

このブログはseesaaブログでもともと用意されているテンプレートを使っているんだが、この前投稿したらAAが上下の幅があきすぎてキレイに表示されていなかった。

何故か?
多分CSSのmargin,paddingのせいだろうと思ってテンプレのCSSを見てみると

やはり
.text{
padding:10px 0px 5px 0px;
margin-top:0px;
line-height:1.8em;
font-family:Verdana;
}
となっているのを発見。

AAは見にくいけど、普通の文章は多少paddingがあったほうが見えやすいってことで、こうなってるんだと思う。
なるべくコレを生かす方向でAAをキレイに表示させる方法を考える。

とりあえずCSS編集で
.mytext{
margin:0px;
padding:0px;
}

と追加して、
<pre class="mytext">
ここにAA
</pre>
で記事投稿してもうまく表示されず・・・

ソースを見ると記事の文章は
<div class="text"></dv>の中に入ることがわかる。

CSSのことはそんなに詳しくないけど
<div class="text">
<pre class="mytext">

</pre>
</div>


だとtextクラスが優先されるとかあるのか??

とりあえずの打開策としてAA表示させるところだけ一回divを閉じてやってみたのが
これ
AA表示テスト

記事投稿内容はこんな感じ
</div>
<pre class="mytext">
ここにAA
</pre>
<div class="text">


一応キレイに見えるけどかなり力技・・・
いつか自分でテンプレートいじってみるかな・・・

・追記(10/1/3)
もっと簡単に出来るやり方を掲載しました。
ブログでAAをキレイに表示させる方法を考える。2


ラベル:aa ブログ
posted by かたひろ at 18:05| Comment(0) | 日記 | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。