ワシはワシが育てる

週刊少年ジャンプと任天堂のゲームが三度のメシより好きです。

CSS

普通のCSSボタンとinputボタンのサイズを揃える方法

input type="submit" value="hoge"のようなinputボタンと普通にCSSでスタイリングしたボタンのサイズが合わなかった時のメモ。 inputにはデフォルトで値が設定されているので、それらを解除します。 解除が必要なプロパティは以下のものがあります。 border …

middlemanの画像URLの参照に盛大にハマる

静的サイト生成に大いに貢献してくれるmiddlemanですが、CSSのimage-urlで盛大にハマったのでメモ。 buildする際、assetファイルにhashをつけるとCSSのimage-urlがおかしな場所を参照するという事態に。 // middlemanでの記述 .hoge { background: image-url…

IEでのbox-shadowのぼかしは偶数にする

CSS

chromeなど他のブラウザでは正常なのにIEではbox-shadowのぼかしが微妙に下にずれる… と悩んでおり色々調べても解決できず数値を色々いじっていたら治りました。 どうやら要因はぼかしが奇数だったことなようで、奇数pxの場合、上に表示されるべきぼかしが下…

何だかんだ言ってCSSを書く文字数が圧倒的に多い

ウェブサイトをRailsでゴリゴリ書いていると、モデル周り等はAPIを使いまわせるし、ビジネスロジックは一つのコントローラーで200行程度なのに、CSSは少なくとも500行、多ければ普通に4桁の世界に入る。 JSやHTML(hamlとかslim)もせいぜい100行~200行くらい…

HTMLとCSSは簡単というのは本当か

本職がコーダーでもないのに言うのは憚られますが、勉強中の人がよく言う「HTMLとCSSは大体使える」というセリフ、それ一度でも実践してから言ってる?と問いたくなる。 まあ言ってる方はなんとなく口をついただけだろうし、勉強して理解が進んだことでテン…

アイコン+文字セットのボタンのactive擬似クラスをIEで作動させる

CSS

なんだか分かりにくいタイトルですが、状況を説明すると ↑こんな感じのアイコン+文字がセットになってるボタンをCSSで組むときに、適切にマークアップしないとIEでactive擬似クラスがちゃんと動作しないよ、ということです。 アイコンをbackground-imageで入…