タグ table-cell
人気順 5 users 10 users 50 users 500 users 1000 users保存版!CSS3で出来る素敵なデザインやアニメーションをまとめてみた
この擬似クラスを使うことにより3番目のli要素にわざわざ別のクラスを付けなくても独自のスタイルを適応することができるので、運用性の向上が図れます。 ▼記事リンク Useful :nth-child Recipes | CSS-Tricks 要素を均等に横並び CSS3の「display:table-cell」は要素を均等に横並びにすることができます。「float」でも要素を横並びに出来ますが、横幅... 続きを読む
レスポンシブWebデザインでテーブルを使う時の小技 │ Design Spice
レスポンシブWebデザインで狭いスクリーンサイズの時にテーブルをどう見せるかは悩ましい問題のひとつです。その対応方法を幾つか調べてみました。 tableやtr、tdなどのテーブル関連のタグのdsiplayプロパティを変更することでデザインを変更します。 tableタグのdisplayの値はデフォルトではtable、tdやthタグはtable-cellといった具合ですが、この値をblockやlist... 続きを読む
[CSS]たった二行で、さまざまなカラムを設定するグリッドのフレームワーク | コリス
たった二行のシンプルなスタイルシートで、さまざまなサイズのカラムを設定するグリッドのフレームワークをを紹介します。 .row { display:table; width:960px; margin:0 auto } .cell { display:table-cell; vertical-align:top; padding-left:10px } HTMLもシンプルでdiv要素を使うだけです。... 続きを読む
画像とかの横にあるテキストを上下中央に|CSS HappyLife
←こういう感じで、画像の横にあるテキストを画像に対して上下中央にするってーのは、今まで出来ないと思ってたんす。 だけども、ヨモツネットさんの記事でヨモツネット[日記] ≫ CSS で簡単に上下中央揃えを実現するってが紹介されてたので、試して見ました! display: table-cell;がポイントになってて、IEはハックで対応みたいな感じです。 ---- こっから続き デモページ 画像とかの横... 続きを読む