Html 如何在容器内对齐图像和导航栏？

我无法对齐容器分区内的徽标和导航栏。导航栏始终低于图像徽标的水平。我尝试了一些html对齐属性，但没有解决这个问题。我正在使用引导CSS，所以我应该在那里更改一些内容吗

<header>
<div class="navbar navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">

            <!--company logo and slogan-->
            <img src="img/logo.png" alt="logo" />

            <!--button for responsive navigation-->
            ...

            <!--Nav bar-->
            <div class="nav-collapse collapse">        
              <ul class="nav pull-right" >
                ...
              </ul>
                            </div>

        </div>
    </div>
</div>

...

...

---

您可以尝试将img和div标签向左浮动，如下所示：

<header>
    <div class="navbar navbar-fixed-top">
        <div class="navbar-inner">
            <div class="container" style="overflow: auto; ">

                <!--company logo and slogan-->
                <img src="img/logo.png" style="float: left; " alt="logo" />

                <!--Nav bar-->
                <div class="nav-collapse collapse" style="float: left; ">        
                  <ul class="nav pull-right" >
                    ...
                  </ul>
                </div>
            </div>
        </div>
    </div>
</header>

...

---

这将使它们显示在相同的级别。

您是否尝试过使用

float

s？可能有图像

float:left
溢出：自动
应用于容器，因为它只包含未清除的浮动元素。除了
溢出：可见
之外的任何内容都将确保包含元素在计算其维度时考虑其浮动元素。