为什么我的徽标在导航栏中的链接下方对齐？

Question

当我尝试对齐我的徽标时，它会在导航栏的其余部分下方和链接下对齐吗？无论如何要解决这个问题吗？

我想是否有办法在链接左侧的导航栏内部获取徽标，但是与它们内联？

＆＃13;

＆＃13;

body {
    background-color: #ece8e5;
    padding: 0;
    margin: 0;
    font-family: 'Monda', sans-serif;
}

.navbar {
    height: 80px;
    background-color: black;
    padding-top: 16px;
}

.navbar a {
    font-size: 26px;
    padding-left: 30px !important;
    padding-right: 30px !important;
}

.nav {
    float: right;
}

.aboutHeader {
    text-align: center;
}

.aboutHeader h2 {
    padding-bottom: 20px;
}

.aboutHeader p {
    font-size: 22px;
}

.footer {
    height: auto;
    width: 100%;
    background-color: black;
    padding-bottom: 0;
    margin-bottom: 0;
}

.footer p {
    padding: 0;
    margin: 0;
}

.footer li {
    display: inline-block;
    padding-left: 100px;
}

.logoImage {
    height: 250px;
    width: 275px;
    padding-top: 0;
    float: left;
}

＆＃13;

<nav class="navbar navbar-inverse navbar-static-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <img src="assets/images/logo.png" class="logoImage">
    </div>
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="about.html">About</a></li>
        <li><a href="portfolio.html">Portfolio</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
    </div>
  </div>
</nav>

＆＃13;

＆＃13;

＆＃13;