###前提・実現したいこと
flexを使って2カラムにしたい
デザインはレスポンシブデザインで組んでいます。
###該当のソースコード
html
1<section class="conA"> 2 <div class="container"> 3 <ul> 4 <li> 5 <p>Menu</p> 6 <a href=""><img src="img/menu-bnr.jpg" alt="menu" width="310" height="145"></a> 7 </li> 8 <li> 9 <p>Salon info</p> 10 <a href=""><img src="img/saloninfo-bnr.jpg" alt="salininfo" width="310" height="145"></a> 11 </li> 12 <li> 13 <p>Access</p> 14 <a href=""><img src="img/access-bnr.jpg" alt="access" width="310" height="145"></a> 15 </li> 16 </ul> 17 </div> 18</section>
CSS
1@media only screen and (max-width:480px){ 2.conA .container { 3 width: auto; 4} 5.conA ul { 6 display: flex; 7 flex-wrap: wrap; 8} 9.conA ul li { 10 flex: 1 1 240px; 11 margin: 0 auto; 12} 13.conA li img { 14 max-width: 45%; 15 height: auto; 16} 17.mainPhoto img { 18 width: 100%; 19 height: auto; 20} 21
よろしくお願い致します。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/02/24 00:07