中心ul李图像div

Question

我想中心ul和li图像，但它没有发生我试过this但这不适用于我。

我想中心的无序列表，它的列表项

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; 
} 

Answer 1

如果你给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%; 
}