cssに関するqtarou123のブックマーク (2)

  • CSSで画像をfloatさせた時にテキストの行間を綺麗に揃えるやり方 – bl6.jp

    何気にこういう細かい部分を調整してあげると見た目も綺麗なりますよね。CSSで画像をfloatしてテキストを回り込ませた時に、画像の下の余白が1行分くらい空いたりすることってあるかと思います。そんな時はテキストのfont-sizeとline-heightに合わせて画像サイズを決めると綺麗に表示させることができます。ということで以下やり方です。 [ads_center] テキストの行を画像に合わせる 以下のように画像の下に余白ができる時ってありますよね。 これを綺麗に揃えていきます。Webデザインレシピさんの記事が参考になりました。 CSS:初心者の頃にハマったスタイルシートのあれこれ … IE7多め まずは1行分の高さを計算していきます。font-sizeが14pxでline-heightを1.5にすると 14px × 1.5 = 21px 1行が21pxになります。で、それを8行分にしたと

    CSSで画像をfloatさせた時にテキストの行間を綺麗に揃えるやり方 – bl6.jp
  • 俺の CSS リセット: 2011 冬

    年末だからというわけでもないのですが、いつものサイト作りに使う CSS リセットについて見直してみました。今までもちょっとずつ手を入れてはいたのですが、今回はかなり大きく修正しています。というのも、Nicolas Gallagher と Jonathan Neal の両氏による normalize.css を知り、大きく影響を受けたからです。 Normalize.css は「新手の CSS リセット」ではありません。CSS を「リセット」するのではなく「ノーマライズ」する、という新しい考え方です。CSS リセットとノーマライズはどちらも、ブラウザ間で CSS の実装に差異があることを前提にそれらを吸収しようとする、という同じ目的を持っています。ただ、リセットはすべてをまっさらな「さら地」にしようとするのに対し、ノーマライズは使える部分は残しつつ手を入れる必要のある部分だけを整える、という違

    俺の CSS リセット: 2011 冬
  • 1