html - CSS 显示与 div/nav 和图像冲突

Question

我有一个徽标图像，我想使用设置的宽度和自动边距显示在导航栏的左侧，所有这些都以页面为中心，但是在我将显示设置为在 div 上内联后，边距消失了。我只是想要一个正确的方向来保持我的边距并在我的导航菜单中显示图像，谢谢！
CSS：

#headWrapper{
    width: 850px;
    height: 430px;
    margin-left:auto;
    margin-right:auto;
    display:inline;
}
nav {
    width: 550px;
    float:right;
}

html

        <div id="headWrapper">
        <img src="images/Logo.png" id="logo">
            <nav>
              <ul>
....

Answer 1

有几种方法可以解决这个问题。背景图像将是其中之一。

HTML

 <div id="headWrapper">
  <nav>
  <span class="icon"></span>
  <ul>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
  </ul>
</div>

CSS

#headWrapper {
    width: 850px;
    height: 430px;
    margin-left: auto;
    margin-right: auto;
    display: inline;
}
nav {
    width: 550px;
    float: right;
}
.icon {
    background-image: url(filelocation);
    width: 14px;
    height: 14px;
    background-repeat: no-repeat;
    float: left;
}