対象ブラウザ毎のCSSハックまとめ

ほんとに最近物覚えが悪く、こんな簡単な事も覚えていないと自己嫌悪に。。。となってる余裕もなく、 すぐさまgoogleで検索するより、自分のサイトからコピペするのが早いので、 よく使うCSSハックを書き留めておきます。

Win & Mac IE（OSX）のみに適用するハック

スターハックと呼ばれるハック。アスタリスク（*）のあとに、スペース、html、スペースをセレクタ名の前に追加する。
Win、Macに関わらずIE6以下に適用。

* html クラス、セレクタ名 {
プロパティ：値
}

IE7のみに適用するハック

スターハックの発展系（？）。アスタリスク（*）のあとに、「＋」、html、スペースをセレクタ名の前に追加する。

*+html クラス、セレクタ名 {
プロパティ：値
}

Mac IEのみに適用するハック

Hollyハックと呼ばれるハック。サイトを制作する上で、このハックの使用頻度が一番高いように思えます（ただし、全く覚えれない）。

/* Only MacIE ¥*//*/
クラス、セレクタ名 {
プロパティ：値
}
/* End */

Mac IEのみスタイルを適用させないハック

こちらも上記のハックと同様、Hollyハックと呼ばれるハック。

/* Except MacIE ¥*/
クラス、セレクタ名 {
プロパティ：値
}
/* End */

実績紹介：「一部上場企業コーポレートサイト」

以前紹介した採用サイトのコーポレートサイト。
2007年5月7日にリニューアル。このリニューアル作業で、

• プランニング
• ディレクション
• サイト設計
• 下層デザイン
• コーディング

とほとんどの作業を行いました。
企業サイトとしての基本はそれなりに抑えたサイトで、ウチの会社もきちんと上場企業サイトを作れるんだぞというアピールができるきっかけにもなる実績です。
とまぁ、淡々と実績紹介をしてますが、実はこのサイトはオープンまでに恐ろしく時間が掛かり、 良い意味でも悪い意味でも反省しきりの例となってます（時間が掛かったのはユーザマターだったのですが）。
このサイトのポイントの一つは、印刷。IEで印刷する際は、IEデフォルトの印刷（余白）範囲でも、 きちんとA4サイズに収まる所です。おそろしく苦労しましたが、印刷したときの美しさは逸脱ものです（あれ、逸脱の使い方これでOKだっけ？）。
ちなみに、IEデフォルトの印刷余白範囲は、19.05mmです。なので、通常760pixel幅のサイトはIEデフォルトでは印刷で横が切れてしまいます。

こちらのサイトの詳しい情報を希望される方は、フッタのcontactかLinkにあるKIKAKUSEISAKUまで。

「中国料理 翔」の紹介。

2週間ほど前、中国料理店のサイトをアップ。
今回のサイトはボリュームが少なく予算も非常に少ない事もあり、 サイト制作を一から全て一人で行いました。
つまりは、

• 設計
• デザイン
• コーディング

を全て一人で行ったという訳ですが、サイトで使用する写真も嫁さんと料理を頂くついでに撮影したものです。

中国料理 翔さんはコース料理が5,000円と若干高めですが、お店の雰囲気、料理の味が全て素晴らしく、 値段を忘れさせてくれる位充実した時間を過ごせるお店です。

サイト自体は、お店の雰囲気・料理が非常に素晴らしいので、その雰囲気をなるべく前面に出すデザインとしています。
大胆な構図の写真を使う事で、他の中国料理店とは差別化できたんじゃないかと思います。
また、コーディングもSEOを意識し、文書構造を厳格化（ポジションを多用）してます。
（ちなみにサイトアップの翌日、「中国料理 翔」でMSN第3位を獲得してます）。

アクセス、代表的なメニューはサイトでどうぞ。
中国料理 翔：オフィシャルサイト：http://www.shou-shinjuku.net