タグ

ブックマーク / css-happylife.com (3)

  • 【Sassを覚えよう!】もくじ的なのと参考リンク

    需要が有るのか無いのかも分からず、半分以上は勢いで書いてたSassを覚えようシリーズですが、少しでも利用する人が増えるきっかけになれば幸いです。 カテゴリ一覧から全部見れますけど、一応【Sassを覚えよう!】の全記事一覧です。 【Sassを覚えよう!Vol.1】はじめに 【Sassを覚えよう!Vol.2】何がすごいの?プログラムが出来なくても使える?効率がホントに上がるの? 【Sassを覚えよう!Vol.3】一番カンタンな環境構築(Scout編) 【Sassを覚えよう!Vol.4】Sassの基的な記述方法 【Sassを覚えよう!Vol.5】環境構築(黒い画面編) 【Sassを覚えよう!Vol.6】黒い画面での実際の運用に関して 【Sassを覚えよう!Vol.6.5】バッチファイルを使ってカンタンに黒い画面でSassを利用する 【Sassを覚えよう!Vol.7】ファイルを分割して管理を楽に

    【Sassを覚えよう!】もくじ的なのと参考リンク
  • clearfixハック|CSS HappyLife

    通常、floatさせている画像やボックスなどがある場合何らかの形でclearするか、その親要素にfloatを指定しないと、親要素からはみ出してしまいます。 コレはCSS2.0の仕様なんで正しい表示なんですが、どうしても親要素にfloatなどが使えず、やむなくclear:bothをbrなりdivにクラス指定して解決してたりって事があったかと思います。 IEの場合はwidth、もしくはheightを指定する事で解決できますが、コレはバグなんで他のモダンブラウザでは解決できません。 ソコでかなり便利に使えるテクニックが、clearfix。 使い方は、clearしたい親要素に下記のように記述。 div:after { content: "."; display: block; visibility: hidden; height: 0.1px; font-size: 0.1em; line-hei

    clearfixハック|CSS HappyLife
    tetblue
    tetblue 2008/04/08
  • 画像とかの横にあるテキストを上下中央に

    ←こういう感じで、画像の横にあるテキストを画像に対して上下中央にするってーのは、今まで出来ないと思ってたんす。 だけども、ヨモツネットさんの記事でヨモツネット[日記] ≫ CSS で簡単に上下中央揃えを実現するってが紹介されてたので、試して見ました! display: table-cell;がポイントになってて、IEはハックで対応みたいな感じです。 デモページ 画像とかの横にあるテキストを上下中央にする。のデモページ ヨモツネットさんとまるっと同じサンプルだとアレなので、ちょっとだけ実用的な感じでつくってみましたよっと。 ちょっと、IE6で確認してないので、ダメだったらご連絡ください。 IE6対応しました。ハックの書き方がいけなかったようです。すみません。 div.centeringTest p { display: table-cell; vertical-align: middle;

    画像とかの横にあるテキストを上下中央に
    tetblue
    tetblue 2008/03/17
  • 1