Sunday | May 15, 2011

ちょっとやる気が出なかったので、たまには、ということで Web 関連の勉強を。
（実はこの blog、自作のテンプレートエンジン(もどき)でできているので、テンプレートさえ差し替えてしまえば割と自由にデザインが変えられるのでした。）

今回は、「table レイアウトにさようなら！ HTML5 + CSS3 対応のモダンサイトへ」をテーマに(?)、土日で HTML と CSS を自分で 0 から起こしてみました。
float:, clear: とか、以前使ったことはあるものの、意外に忘れてしまって苦戦しました。
なお、テクスチャボタンの箇所は、ASCII.jp：box-shadowを極めて「Mac風UI」を作る！｜菊池 崇の実践！CSS3道場 のページを参考に（というかほぼそのままコピー）させていただいています。ありがとうございます。

実はまだ Safari でしか表示確認していないので、何かまずそうだったらコメントしていただけると嬉しいです。

ちなみに、pre 要素も

$ ls
a.out
test.c

いい感じになりました。

(追記)
Internet Explorer 8 for Windows, Firefox 4 for Windows, Safari 5 for Windows で表示確認。とりあえず、機能的な問題は無いと思います。しかし、Safari for Windows、暫く使ってなかったから良くなってることを期待したけど、相変わらずですねぇ。

コメント投稿のテストです。
吹き出し型に表示されるようにしてみました。

今まで通り、最新の投稿は下に表示されます。

新しいコメントを書きたい場合は、一番下にあるフォームに入力してください。

IE + HTML5 でスタイルが適用されない問題があるのですね。
これを適用しました。

http://mayy.me/html5/html5js.html

Google Chrome(Version: 11.0.696.65)での表示は問題ないと思います

>> htakayuki
ありがとうー！
安心の Webkit 仲間ですね！