Alpha

画像をFloatさせた時に起こる現象（Firefoxだけかな？）やけれども、vertical-align:bottom;でなくすことが出来る。例としては以下の通り。

XHTML

<ul>
<li><a href="#"><img src="navi01.png" alt="navi01" width="100" height="20" /></a></li>
<li><a href="#"><img src="navi02.png" alt="navi02" width="100" height="20" /></a></li>
<li><a href="#"><img src="navi03.png" alt="navi03" width="100" height="20" /></a></li>
</ul>

CSS

ul li{
float:left;
}
ul li img{
vertical-align:bottom;
}

オススメしない

img{
vertical-align:bottom;
}

※全てのimgにvertical-align:bottom;をかけないほうがいい。IEで逆に余白ができてしまうことがあるから。（floatをかけているところだけにかけること。）

世の中にはたくさんのファイル形式があって、その中の画像1つとっても多くの形式が存在します。PNG,GIF,JPG,TIFF,BMP,SVG,PIC,PSD,EPS,AI・・・etcとまだまだあるみたいですが、そのうちでもPNG,GIF,JPGあたりはよく利用されるほうです。ただ、メモ帳とかで画像って開けない。（メモ帳でいじることができない）。

そこで誕生したのがSVGっていう画像形式。メモ帳で開いて編集することができる。ベクター形式（拡大しても画質は同じ）。そんな便利な画像形式であるSVG、ネックは重たさと作りづらさ。
メモ帳で編集できるのはいいけれども複雑なのはやっぱりAdobe Illustratorなどを利用しないと難しい。ファイルそのものは軽くても表示が重い。なので普及していません。するといいんだけどなぁ・・・。

どうも普及していきそうだと思っていたこの形式もまだまだか、もしくは廃れていってしまうのかも。早く普及すれば検索エンジンでも画像が認識してもらえるようになるかもしれないのにぃ。と思う昨今です。

Internet Explorer 8がついに正式発表されたので入れてみました。

今のところここのブログは崩れていないようだけれども、サイトによっては思い通りに表示されないところが出てきている気がする。ブラウザの表示が悪いのかそれとも自分が悪いのか。どうなんだろう。

早く混乱を招く、各種ブラウザによる描画の違いが無くなってすべて同じように表示される日が来てほしいと思う。それだけを願うばかり・・・。

CSSは人それぞれの書き方があってそれはそれでいい。ただ、共同作業となるとなるだけそのプロジェクトに参加する人のことを考えて作成しないといけない。
多少なりとも記述が増えても柔軟なほうがいい。記述する際の注意点を考えられる限り並べてみた。

1. <h1>など、1ページに1箇所のみ接地するタグなどは<h1>に直接プロパティを記述
2. 2箇所以外に利用する可能性のあるスタイルは汎用性の高いクラスを利用する
3. インデントや記述の順番を明確に決める
4. (X)HTMLの記述順に合わせてなるべく上から順にスタイルを記載する
5. 共通CSSファイルをあらかじめ用意し、その他追加する必要が出てきたときは別名のCSSを作成する
6. なるべくインデックスやコメントを付けて一目でどこのスタイルなのかを判別できるように記述する

使い勝手が良くて、何せ三重に特化した地域ブログとしてとってもお気に入りだったこのサービス。せやけど、この前びっくりしたことがあったんやわ。

放置しとった人は気づいてなかったかも知れへんけど、データが消えるってことになってかんなりやばかった。たまたま気づいたおかげで、バックアップをギリで取って別ブログに移行作業したんやけど、なんだかんだで再開。
結果としてはよかってんけど、こちとら移行しちゃったからネタがねぇよって感じなんすわ。勘弁してくださいでした。

何はともあれ元通りになってよかったわぁ。