问题描述

在制作导航栏的时候，logo旁边有几个菜单选项，我把logo放在了div中，让后把菜单选项放在了ul中的li标签中，但是这时候不管怎么设置，logo的div和菜单选项的ul就是无法在一行上显示，掉了下来。

问题出现的环境背景及自己尝试过哪些方法

最外层的大盒子用了bootstrap的container布局，logo的div和ul都用了栅栏系统col-md-*来定义的宽度

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）
index.html中代码如下:

<div class="container">
    <div class="top">
        <div class="logo col-md-2">
            <img src="./images/logo.png" alt="">
        </div>
        <ul col-md-3>
            <li>
                <a href="#">首页</a>
            </li>
            <li>
                <a href="#">币币交易</a>
            </li>
            <li>
                <a href="#">U币宝</a>
            </li>
        </ul>
        <span class="account-balance"></span>
        <span class="userAction">
            <a href="#">登录</a>
            <a href="#">注册</a>
        </span>
        <div class="language">
            <span class="choose">简体中文</span>
        </div>
    </div>
</div>

index.css中代码如下:
.top {
  height: 70px;
  background-color: #ccc;
}
.top .logo {
  height: 100%;
  position: relative;
}
.top .logo img {
  width: 80%;
  height: 36px;
  /* 实现实现图片竖直方向上的居中 */
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.top ul li {
  background-color: #999;
  height: 70px;
  display: block;
  float: left;
}

你期待的结果是什么？实际看到的错误信息又是什么？

能够让放置logo的div和ul在同一行上显示