将合作伙伴徽标添加到我网站的页脚,与我的其他合作伙伴徽标位于同一行?

Adding a partner logo to the footer of my website on the same line as the rest of my partner logos?

我正在尝试将新的合作伙伴徽标添加到我网站的页脚,但它一直出现在下一行,我想知道你们是否可以帮助我将其与其他人放在同一行?

HTML(为了便于阅读,我删除了链接和 alt 标签):

<section class="bottom-logo">
    <div class="row">
         <div class="large-12 columns">
            <ul class="footer-logos">
                <li><img src="" alt="" />  </li>
                <li><img src="" alt="" /></li>
                <li><img src="" alt="" /> </li>
                <li><img src="" alt="" /> </li>
                <li><img src="" alt="" /> </li>
                <li><img src="" alt="" /></li>
                <li><img src="" alt="" /></li>
            </ul>
        </div> 
    </div>
</section>

CSS:

.bottom-logo{min-height: 150px;}
.bottom-logo img{
    filter: grayscale(1);
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
    -ms-filter: grayscale(1);
    opacity: 0.5;
    margin-top: 30%;
    margin-left: auto;
}
.bottom-logo img:hover{
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
    -moz-filter: grayscale(0);
    -o-filter: grayscale(0);
    -ms-filter: grayscale(0);
    opacity: 1;
}

.footer-logos li{
    list-style: none;
    display: inline-block;
    margin: 2% 3.5%;
}

谢谢!

将CSS改成这个

.footer-logos li{
list-style: none;
display: inline-block;
margin: 2% 3.5%;
Width: 10%;
}

.footer-logos li img {
 Width: 100%;

}

调整 li 上的宽度百分比以满足您的需要。