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

  • 画像とかの横にあるテキストを上下中央に

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

    画像とかの横にあるテキストを上下中央に
  • ふつーにやるより効率が良さそうな事とか使ってるソフト

    エントリーしないとemoの顔がいつまで経っても出来ないからネタが無い中無理矢理考えてみた。 手打ちでもDreamweaver使ってる場合でも、何かと面倒な作業が多い訳で。 そんな時にちょっと便利だよねぇ~って思えることとかボクが使ってるソフトをば。 リスト(ul、ol)を作るのがだるぃー。 出現頻度が高い要素の一つ、リスト。 <ul> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> <li>リスト4</li> <li>リスト5</li> </ul> ↑こういうのっすね。 んで、コレをさくっと作るのに便利だなーって思ったのが、 MT4のリストボタン。 Dreamweaverだと途中に改行が有っても1つのリストにされちゃうけど(Ver8は)、MT4は改行毎に別のリストにしてくれる。 テキストを自分で打つ場合は、手間じゃないけど、データもらってて一気にリストに

    ふつーにやるより効率が良さそうな事とか使ってるソフト
    eri0412
    eri0412 2013/06/03
    作業効率化
  • コーディングする時のスライス方法とか - CSS HappyLife

    珍しく、Photoshopネタでも。 コーディング関係だからこのブログの主題っぽい! 今回は、PhotoshopCS6を利用したスライスに関するアレコレです。 コーディング時にはスライスは必須ですし、一番面倒な部分なので少しでも効率良くスライス出来ると良い感じですよね。 内容としては、スライスの基からって訳じゃないので、最低限スライスツールが使えてる方を対象にしたような感じになってると思います。たぶん。 ちなみに、面倒な説明しなくていいから分かりやすい様に動画ベースでやっていきます! Photoshopを起動します 何はともあれ、Photoshopを起動します。 これはすごく重要な作業です。 Photoshopは重いので起動するのがダルいですね。ウチのVAIO Zが頑張ってます。 CS3の頃はサクサクで良かったんですが。 起動したら、psdファイルを開きましょう。 普通のスライス まずは

    コーディングする時のスライス方法とか - CSS HappyLife
  • 1