:この記事は5分程で読めます。ナビゲーションやリストを水平に並べると、なぜか少し隙間が生まれてしまうことがあります。今回はこの現象の解決方法をいくつか紹介したいと思います。簡単な方法なので、知っている人も多いと思いますが、もし知らない人がいれば、ちょっとは役に立つかと思います。基本的にはfloatで解決すれば良いと思いますが、floatを使うと都合が悪くなる場合などもあると思うので(width指定とか、センタリングとか)、そんなときのためにどうぞ。個人的にメモしておいたものを、WEBにUPして管理しておきたいという意味もあり、今回記事にしています。#ffffff;}プレビューバナナリンゴミカンこのままだの状態だと上記のように、いらない隙間ができてしまいます。HTMLをいじって解決いくつか方法があるんですが、私がよく使う方法と、お勧めの方法をご紹介します。<li>バナナ</li><li>リンゴ</li><li>ミカン</li></ul>プレビューバナナリンゴミカン一番簡単な方法です。リストの内容が少ないときはお勧めです。私は基本的にこれで解決しています。ミカン</li></ul>プレビューバナナリンゴミカンリスト内容が多いときはこの方法で解決すると良いと思います。--><li>ミカン</li></ul>プレビューバナナリンゴミカンこれもリスト内容が多いときに使うと良いと思います。CSSをいじって解決こちらもいくつか方法があるんですが、私がよく使う方法と、お勧めの方法をご紹介します。#ffffff;}プレビューバナナリンゴミカンdisplay:table-cellでも横並びになります。inline-blockにこだわりが無ければ上記の方法で良いと思います。私はこれが一番のお気に入りです。font-size:13px;}プレビューバナナリンゴミカンfont-size:0;にすると、幅も0になるのでスペースも消えます。どれを使って解決させるかに、正しい方法・誤った方法は基本的に無いと思いますが、解決する方法がいくつもあるということは頭に入れておいたほうが良いと思います。今回紹介したもの以外にも沢山解決方法はあります。他の便利な解決方法を知っている方がいればぜひ教えていただきたいです。※【HTMLをいじって解決】に記載しているすべてのプレビューは、WPのHTML自動整形機能がONになっている関係で、実際にはCSSを使用して解決させています。ここで紹介しているように、通常はHTMLだけ修正して解決させることができます。目的を達成させるための最適なWebサイトのタイプ(種類)コンバージョン率を上げる40のポイントこの記事へのコメント現在、この記事へのコメントはありません。(必須)コメント本文:この記事へのトラックバックとピンバック現在、この記事へのトラックバックはありません。販促カラーデザインの基本。メイン・サブ・アクセントカラーを極める!デザイナーだから考える。青色が与える27の効果と7つの活用例あなたが作ったサイトのフッターの役割は?12のフッター活用方法!新人デザイナーに教えたいWebデザインの基本原則【整列】ディーター・ラムスの「良いデザインの10原則」から学ぶカラーデザインの基本。naitoWebクリエイターズマニュアルは、WebデザイナーからWebディレクターになった男が記録する、Webクリエイターのためのマニュアルブログです。Webクリエイターとして必要な、カラーデザインの基礎や、提案書の書き方からアクセス解析の基礎応用まで包み隠さず紹介していきます!このブログを読んでWebクリエイターとしての知識を身につけよう!pagetop。