CSS显示一行包裹的图像

Question

我的HTML文件中有一些包装图像：

<div id="banners">

    <div id="friend">
        <a target="_blank" href="http://www.google.com">
            <img src="../assets/images/friends/friend_1_256.png" alt="TEST 1" width="200" height="200">
        </a>
    </div>

    <div id="friend">
        <a target="_blank" href="https://www.google.com">
            <img src="../assets/images/friends/friend_2_512x157.png" alt="TEST 2" width="400" height="123">
        </a>
    </div>

</div>

我想连续显示这些图像。我尝试了float: left或display: inline-block等解决方案，但都没有。是否可以内联显示包装图像？

Answer 1

它应该工作。尝试这样的事情。

between

#friend {
  display: inline-block;
  border: 1px solid red; /*Just to highlight */
  width:200px;  /*Set width according to parent id banners*/
  text-align:center /*center image*/
}

Answer 2

试试这个，它对我有用，希望它也能解决你的问题

#friend{display:table-cell;}