レイヤー重ね順 z-index 中央揃え position

https://saruwakakun.com/html-css/basic/z-index

https://cotodama.co/position-absolute-center/

 

ユニオンの婦中スタジオ移転のために、婦中ページに一時施行

親要素にrelative付けなくても丁度良い箇所(スタジオ情報箇所に挿入された?)

 

.studioOuter2 {
position: absolute;
z-index: 20;
height: 30%;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}

 

<div class=”container”>
<div class=”row”>
<div class=”col-xs-12 studioOuter2″>
<img src=”../images/studio/toyama_fuchu/jyunbi01.png” class=”img-responsive center-block” alt=”2018冬移転オープン”/></div>
</div>
</div>

赤い箇所は画像を中央揃えさせるため。

 

それでも他の部分が重ねたレイヤーの上部に重なって表示されるならば、その要素に

style=”z-index:1;”

で一番奥のレイヤーとして指定して、重ね順を調整。

centiaテニスのstudio/nanao.htmlでも実装