タグ

TIPSとリストに関するbeth321のブックマーク (3)

  • [CSS]リスト要素を左寄せぴったりに配置するスタイルシートのテクニック

    中黒のような黒丸、四角、数字など、リストの先頭につくマークを左寄せに揃えるスタイルシートのテクニックを紹介します。 対応ブラウザはIE8+で、ネガティブマージンは使用しません。 Align Lists Flush Left ブラウザごとに異なるサイズのマークでも、数字のリストで1桁から2, 3桁と増えても全てに対応できるテクニックです。 まずは、マークアップから。 HTML ulもolもシンプルな実装です。 <h3>Unordered List</h3> <ul> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> </ul> <h3>Single Digit List</h3> <ol> <li>Lorem ipsum dol

  • ToDoリストを4色ペンで作るといい理由 | ライフハッカー・ジャパン

    次からToDoリストを作るときは、4色ペンを手にとってみることをおすすめします。 「プロダクティビスト」の Mike Vardy 氏は、これからやるべきこと(ToDo)を紙に書き出す際に、4色に色分けしているそうです。 グリーン:仕事関係のタスク。いわゆる「困難な仕事」で、適当にはできないタスク。きっちり仕上げるために強い意志力が要求されるもの オレンジ:個人的で、深い関わり方をするタスク。おもに、家族関係やプライベートなタスクがこの色になります(オレンジは注意力と集中力を高めてくれる色だとか。まさにぴったりです) ブルー:上記のどちらにも属さないタスク。ブルーはおろらく最もよく使われる色ですので、このカテゴリーに合っています。控えめですが、少しは目を引く色です ブラック:作業中のタスクに使います。タスク自体をこの色で書くことはありません。矢印や取り消し線、補足メモなどを書き込むのに使いま

  • hail2u.net - Weblog - floatで並べたリストのセンタリング

    ページング・ナビゲーションなどでリスト項目をfloat: left;で横に並べるというのは割りと良く使われると思う。並べること自体は特に難しいわけではないが、その並べたリスト全体をセンタリングしようとするとちょっとややこしい。display: inline-block;を使う手法やdisplay: table;を使う手法という黒魔法的(私見)な手法で実現可能だが、position: relative;でもいける。 ややこしい理由は簡単で、センタリングでよく使われるtext-align: center;やmargin: 0 auto;といった手法が通用しないから。検索するとすぐ出てくる比較的メジャーなdisplayで頑張る方法もわかりやすいし悪くはないのだけど、同一セレクタ内で複数のdisplayを駆使する必要があることやzoomマジックなどを併用する必要があることからコードがややこしくなる

  • 1