タグクラウドの行間が狭い人
2007/12/09 Sun [Edit]
ここ数日私が何をしていたかと言うと、ブログの過去の記事へのタグ付けです。
記事も少しずつですが増えてきているので、ここは1発、今、密かに流行(はやり)始めているタグクラウドに手を出そうという目論みです。
おそらく
『何を今更・・・』と呆れた方が30%。
『残念な管理人だな・・・』と同情してくれた方が10%。
『あれ?コレいつの記事だ?』と日付を確認された方が20%。
無関心が40%。
でも待ってください。あなたのタグクラウドの行間はギッチリ詰まっていませんか? 「おう!ギッチギッチに詰まってるのがタグクラウドってもんだ!」なんて方いませんか?
それはそれで我武者らな感じで素敵だとは思いますが、Jazz が似合う私のような大人は知っています。行間が詰まらない方法を。
CSS縦のセンタリング(中央揃え)
2007/06/18 Mon [Edit]
CSS で横のセンタリング(中央揃え)は margin : auto や text-align : center などで事足りると思うのですが、縦のセンタリング(中央揃え)は何を使えば良いかご存知ですか?
私はつい先日まで知らなかったのですが line-height プロパティで縦のセンタリングが可能です。方法はとても簡単で、ボックスの高さと line-height の値を同じにするだけで縦のセンタリングが行われます。下のソースを参考にしてください。
div.hajime {
width : 400px;
height : 50px;/*ボックスの高さ*/
line-height : 50px;/*縦のセンタリングの為に指定*/
}
簡単な上、Macのモダンブラウザ、Winのモダンブラウザで縦のセンタリングが適用されます。
個人的には何故か素通りしていた部分だったのですが、少し調べたらあっさり解決してしまった事例です。少しの手間を面倒臭がってソースを複雑にしていた事に反省です…。
■追記( 2008/08/09 )
通りすがりさんから貴重なご意見頂きました。上記の方法はテキストが複数行になると勘の良い人は察しがつくかも知れませんが、行間が大変広くなります。つまり1行のテキストの時にのみ有効な方法です。ちなみに line-height は文字送りを指定するプロパティなので、インライン要素にのみ適用されるプロパティです。
そこで「良い方法はね〜か〜」とわりと大きめの声でつぶやきながらネットを検索したところ、参考になりそうな掲示板を発見しました。少し古い書き込みですが、CSS の知識が豊富な方が解決策と思えるような書き込みをされています。興味がある方は覗いてみて下さい。
いつだったか書籍でこの縦のセンタリングについて読んだように思うので良い方法がありましたらご紹介します。夢の中の本屋さんでしたらごめんなさい。





