横に並べるレスポンシブ

html

<div class="photoul">
<ul>
<li>
<img src="/web/wp-content/uploads/2019/11/photoul-300x198.jpg" alt="　　" /><br />テキスト
</li>
<li>
<img src="/web/wp-content/uploads/2019/11/photoul-300x198.jpg" alt="　　" /><br />テキスト
</li>
</ul>
</div>

css

.photoul{
margin:10px auto;
text-align:center;
}

.photoul ul{
list-style-type:none;
margin:0;
padding:0;
}

.photoul li{
margin:10px;
padding:0;
display:inline-block;
text-align:left;
}