Html 我的图像不会水平对齐

我无法使用display:inline水平内联div

这是我的代码：

 <div class = "links">
   <ul>
      <div id = "twitter">
         <a href = "#">
            <li><img src="images/twitter.png" /> </li>
         </a>
      </div>
      <div id = "facebook">
         <a href = "#">
            <li><img src="images/facebook.ico" /></li>
         </a>
      </div>
   </ul>
</div>

尝试在中添加flex以显示属性。链接：

---

Jad的答案是一个解决方案，而我的答案是一点解释

.links  ul li {
  display: inline;
}

此代码将使列表元素内联。都是零。您使用的是div元素，CSS规则找不到它。您可以更改规则或HTML，但您希望CSS规则以某种方式应用于正确的元素类型。Michael_B是对的，ul中的非li是无效的HTML

您需要设置facebook、twitter{display:inline block}。就这些

推特img， 脸书img{ 填充：10px； 高度：60px； 宽度：60px； } 啁啾 脸谱网{ 显示：内联块； } .links ul{ 背景色：RGB0125210； }

---

请注意。你需要重新调整你的分数。请将最佳答案标记为已接受。有人否决了我和Jad的答案，但我不知道为什么。

.links ul {
  background-color: rgb(0, 125, 210);
  float: center;
  display: flex;
}

.links  ul li {
  display: inline;
}