css - CSS 画像を中央に揃えるエラー

Question

イメージと別の小さな < div > をラップするコンテナーと呼ばれる < div > があります。問題は、画像をコンテナの中央に揃えようとしていることです。大きな画像だと。真ん中に収まりますが、小さい画像だと左側に傾いてしまいます。画像の位置を真ん中にするにはどうすればよいですか？マージンを使用せずに。margin を使用すると、小さな画像は中央に配置されますが、大きな画像は右側に傾くためです。

私のCSS

 .container{background-color: #ED8713; 
 height: 300px; 
 width: 300px;
 margin: 60px;}

 .box6{background-color: #FFFFFF;
  width: 270px;height:80px;
 margin: 5px;}
 img {margin: 10px;}

私のHTML

<meta charset="utf-8" />
<link rel="stylesheet" href="float.css">



<div class="container"><img src="s.jpg"/>
                    <div class="box6"></div>

</div>

<div class="container"><img src="q.jpg"/>
                    <div class="box6"></div>

</div>