CSSでfloatした要素群を中央揃えにする :: OMIMO.net／デザインとクラフトワークと、写真と映像と、少しのプログラム
一連のブロックレベル要素を横に並べるのに、float: left; などとやっていると、並ぶのはいいのだがすべて左詰め（float:leftの場合）になってしまい、中央揃えにするのは一筋縄ではいかない。どうするかというと、 <div id="container_of_content"> <ul id="container_of_listed_items"> <li class="listed_items">項目1</li> <li class="listed_items">項目2</li> <li class="listed_items">項目3</li> <li class="listed_items">項目4</li> </ul> </div> 例えばこんなソースがあったとして、 div#container_of_content { position: relative; overfl
[意外と知らないCSS]スマホ制作に便利！display:table-cellを使った横並びのレイアウト | Cappee Design
スマホコーディングただいまガシガシ中の@cappeeです。 今回は「意外と知らない」というか、「便利だけどなかなか使えないCSS」かもしれませんね。 今回は、display:table-cell をご紹介します。 なかなか使えないと言った理由はIE8以降からの対応になるからです。 ただし、display:table-cell はスマートフォンサイトの制作にかなり便利なので覚えておくことは必須ですね。 display:table-cell で要素が簡単に横並び display:table-cell とは、要素をテーブルのように表現することができるプロパティです。 親の要素に display:table を指定することでテーブルと同じような構造で指定することができます。 display:table-cell を指定した要素はテーブルのように高さが同じになります。 また、floatを使っていな
WordPressのページナビゲーションをPC版とスマホ版で最適化したい *Ateitexe
引き続き、WordPressのページナビを、PC版とモバイル版でそれぞれどんな形が最適なのかなぁと試行錯誤して実装実験してみました。昨日、WordPressプラグインWP-PageNaviをスマホで押しやすいレイアウトにという記事を書いたばかりなのですが、良いカタチを目指してもうちょっとテコ入れ…。 前後ページへのリンクを分かりやすく 前のページ・次のページへのリンク、当初は「«」「»」で表していたんですが、これって、どうなの…？という気持ちがむくむくと…。やっぱりちゃんと文字で書いたほうがいいんじゃないのかな、と感じました。 WP-PageNaviだと一番外に実装できない 「前のページ」「…」「3」「4」「5」「6」「7」「…」「次のページ」みたいな形の方が分かりやすいんじゃないかなと思うんですが、今のままだと実装できないので、プラグインなしでやってみることにしました。 スマホ版は、そん
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【トラストモニター】アクセス解析レポート作成ツール｜GoogleAnalyticsを利用してプロ仕様のモニタリングレポートを簡単作成
g86 has gone.
