[解決済み] divの中のcenter ul liの画像

質問

ulとliの画像を中央に配置したいのですが、うまくいきません。 これ しかし、これは私のために動作していません。

順序なしリストとそのリスト項目を中央揃えにしたい

HTML

<div class="brands">
  <ul>
    <li><img src="images/flipkart.png"></li>
    <li><img src="images/ola.png"></li>
    <li><img src="images/olx.png"></li>
    <li><img src="images/telenor.png"></li>
    <li><img src="images/uc.png"></li>
    <li><img src="images/oyo.png"></li>
  </ul>
</div>

CSS

.brands {
  width: 100%;
  min-height: 120px;
  background-color: #d7d7d7;
}

.brands ul {
  margin-right: 10%;
  margin-left: 10%;
}

.brands li {
  float: left;
  list-style: none;
}

.brands img {
  padding: 35px 40px;
}

解決方法は？

もし、あなたが float: left として扱われることはありません。 inline 要素を使用します。使用方法 display: inline-block にすることで inline 要素に block のプロパティを使用して中央揃えにします。 text-align: center :

.brands li {
  display: inline-block;
  list-style: none;
}
.brands ul {
  text-align: center;
  margin-right: 10%;
  margin-left: 10%;
}