CSSボックスを固定したら必要!CSSで順番を指定するプロパティツイートposition要素でボックスを固定するだけでは足りません。セットでz-indexで順序を指定します。表示位置固定の手法ですが、このブログでもシェアボタンに採用しています。左側に出ている位置をキープしているやつです。これはCSSのpositionプロパティを使っているのですが、セットで使うべきプロパティがひとつあります。これを忘れちゃうとせっかく固定したのに意図しない状態でみれないなんてことも起こりうるのでしっかりプロパティを追加しておきましょう。どのようなことが起こるか通常はdivなどを使ってレイアウトを骨組みするので各ボックスが重なることはないのですが、positionを指定すると位置を固定できるため平気で他のボックスに重なります。その場合、どちらを上に表示するか決めておく必要があります。これが指定方法によっては隠れてしまう(意図的に隠すという使い方もある)重なった部分の表示順の指定によって動作が変わるのです。順番を決めるCSS重なった部分の表示順は「z-index」というプロパティで指定できます。値が大きいほど上に表示されます。値はマイナス値も指定することができます。上の埋まった画像はマイナス値を指定し意図的に作りました。この「z-index」プロパティは「position」を指定している要素に対し使えるのですが、どの要素に使えるかというより、「z-index」と「position」はセットで使うと覚えたほうが楽ちんです。生活でしたが見ているだけよりも踊らにゃソンソンの精神でWebの輪に参加すべくBLOG開設。背景を半透明すりガラス風に。reserved.ごすてっぷ:WordPress、Webサービスなどの情報を5ステップくらいで紹介しています。