ソラリンク株式会社ロゴ

北海道帯広市にあるホームページ制作、WordPressの構築を手がける制作会社

備忘録MEMO

tableタグを使わず、要素を上下左右中央に配置する

201908追記

高さの中央方法

.outer{
display: table;
width: 100%;
}
.inner{
display: table-cell;
vertical-align: middle;
}

 


 

201807追記

.outer{

position: relative;

}

.inner{

position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); -webkit- transform: translateY(-50%) translateX(-50%);

}

でもOKです。

 


 

<ul>

 <li><p><img src=”1.jpg”></p></li>
 <li><p><img src=”2.jpg”></p></li>
 <li><p><img src=”3.jpg”></p></li>
 <li><p><img src=”3.jpg”></p></li>
 <li><p><img src=”1.jpg”></p></li>
 <li><p><img src=”2.jpg”></p></li>
</ul>

 

<style type=”text/css”>

li{
 float:left;
 margin:0 20px 20px 0;
}
p{
 display:table-cell;
 width:220px;
 height:220px;
 layout-grid-line:220px;
 text-align:center;
 vertical-align:middle;
 border:1px solid #CCC;
}
</style>

備忘録

制作サポートエリア

ソラリンク株式会社は、帯広市を拠点とし、北海道全域(札幌、旭川、函館、釧路、苫小牧、室蘭、北見)をサポートエリアとしております。もちろん、メールやスカイプでの打ち合わせであれば、日本全国からのご依頼に対応可能です。