Compassスマホ対応、タブレット対応のWEBを作るときに使われるレスポンシブWEBデザイン。これはメディアクエリが必須となっています。ボクは日頃レスポンシブWEBデザインは使用しません。面倒くさいし、ボクの技量ではデザインが限られてくるからwwwそれでも試練はやってくるのです。ことでSassでメディアクエリを書く方法は色々とありますが、間に合わせ的な書き方を発見しましたのでメモっておきます。ブレイクポイントは変数に!ブレイクポイントを毎回書くのが面倒くさいので変数に書いちゃいましょう。{//960px以上}上記のように書けば大丈夫です。実際に実践のように書くと以下の様になります。700px;}}という風に普通にネストして書けます。まとめただし通常のSassにそってネストして書いていくのでコンパイルしたCSSの長いこと長いこと・・・。その他にも@extendが使えなかったりするようですので、間に合わせ程度に覚えておくといいでしょう。関連記事[CSS]同じサイズのボックスを横並びにするときのコツネガティブマージンってイヤですね下山です。Fireworksで...記事を読む[CSS3]column-countで紙面デザインのようなテキストレイアウトにしてみよう5ヶ月ぶりの更新ですの。サボってたわけじゃないの。これには話せば長~~~くなるようなストーリーがありまして・・・。いう訳で...記事を読む[CSS]liをfloatして横に並べてそれを中央配置にするオレ的まとめもうタイトルが何言ってるか分からないですが読んだ通りですはい。いや、説明するとliをfloat:leftすると左揃えになってしまうも...記事を読む[CSS3]CSS3のベンダープレフィックスが必要なプロパティってどれ?CSS3ってベンダープレフィックス書くとき結構適当に書いてます下山です。いや、適当いかんやろ!ということで、どこかに一覧がないか...記事を読む[CSS]画像加工なしで写真をレイアウトする頭痛と戦うWEB屋さん下山です。「トップページの写真を自分たちでも入れ替えたいよねー」って言われましてね。Photoshop...記事を読む[CSS]ディスプレイサイズが変わっても背景画像を画面いっぱいに表示する背景画像を画面いっぱいに表示する=jQueryって思われがちですけどCSSで十分いけまっせ。言ってもbackgroundで...記事を読む[CSS]背景にビデオを配置して全画面で表示するよ!珍しくビデオネタです。言ってもCSSネタなんですけど。いう訳で、ビデオを背景に配置して全画面で表示するみたいな案件が来そ...記事を読む[CSS]min-heightで最低限の高さを指定する(IE6対応)実際の案件の要求とは別件ですがmin-heightについて。