とーーーっても今更感が満載ではありますが、
第2回コーディングコンテストに応募した作品（？）を公開しておきます。
ついでに、第1回目の作品も公開しておきます。

 

ちなみに、賞をとることはできませんでした。
残念です。
次回、がんばります。

 

以下、第2回作品をコーディングしてみた感想など。

 

「display: -moz-box;」、「display: -webkit-box;」を初めて使った

「display: -moz-box;」、「display: -webkit-box;」を初めて使ったけど、
便利ねー。
もうじゃんじゃん使っていきたい。

【参考】

 

inputのplaceholder属性

inputのplaceholderを使ってみようとしました。
テキストフィールドにうっすら文字が出ていて、
focusすると消えるアレです。

けど、Safari4でしか動きません。
Firefox3.6も動いてくれればいいのに。

なので、jQueryのプラグインで実装しました。

【参考】

 

「header」、「footer」、「nav」、「aside」、「article」、「section」はインライン要素

「header」、「footer」、「nav」、「aside」、「article」、「section」はインライン要素らしいので、
それぞれ「display: block;」するのが良さげ。

header,footer,nav,aside,article,section {
  display: block;
}

 

グラデーション

背景のグラデーションをCSSで表現してみました。

あと、角丸もCSSでやってみました。

【参考】