HTML/CSS今回は、ブラウザ幅に合わせてコンテンツの幅を変化させる「リキッドレイアウト」でも機能する横並びにしたナビゲーション(いわゆるグローバルナビゲーション等)を作るCSSの指定方法です。コード⇒配置イメージ⇒説明の順で書いていきます。※コードの説明を簡略化するため、リセットスタイルやliの中に入れるであろうa要素は省きます。*/}HomeAbountContactinline-blockという指定をすると、簡単にいってしまうと、幅・高さの指定ができるinlineの要素といった感じになります。center;で中央寄せすることができ、floatを指定しなくても横並びになってくれます。inlineとzoomを指定しています。※CSSハックについては、IE用CSSハックの簡単な書き方とIE10以上への対応を参照してみてください。注意点は、各liの間に改行を入れてしまうと隙間が開いてしまうので、liの後に改行を入れずにコード上も横並びにする必要があることです。liをfloatで配置しているときには起こらない現象ですが、displayがinlineの要素の並びやテキスト中の改行は空白文字扱いになるのでこういったことが起こります。コードの可読性などの問題で改行を入れたい場合は、改行部分をコメントアウトする方法で対応できます。</ul></div>以上、ナビゲーションを中央寄せする簡単な方法でした。web関係のことなどをしているPC大好き人間です。Aboutweb制作をする人や2か月後の自分のために、技術系のことを中心に覚えたことや思いついたことを書くために始めたブログです。Codery.ページトップ。