引导列在chrome中是正确的，但它不会在Internet Explorer 11中呈现。？

Question

我有容器类行，每行有两列col-md-6。 chrome中的列是正确的，但在IE 11中，右列位于左列下方。我们如何解决这个问题仅在IE中。要检查完整的结果，请点击[这里]：http://risalat1.com/projects/accordv1/这我试图在标题X-UA-Compatible中添加元标记，但没有相应的工作以下是chrome的图像。

Internet Explorer 11中的结果提供以下

<div class="common top_bar">
    <div class="container">
        <div class="row">
            <div class="col-md-6">
                <span class="header_no"></span>
                <span class="header_email"></span>
            </div>
            <div class="col-md-6">
                <ul>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </div>
        </div>
    </div>
</div>

.top_bar{
	background: #67c152;
    padding-top: 10px;
    padding-bottom: 10px;
}
.top_bar ul{
	text-align: right;
	margin-top:-4px;
}
.top_bar ul li:first-child a {
    margin-right: 10px;
}
.top_bar ul li a {
    margin-top: 3px;
    display: block;
}
.top_bar span{
	font-family:"Lato-Light";
	font-size: 18px;
	color: white;	
	font-weight: normal;
	padding-left: 30px;
}
.top_bar span:first-child{
	margin-right: 35px;
}

<div class="common top_bar">
		<div class="container">
			<div class="row">
				<div class="col-md-6">
					<span class="header_no">092093090</span>
					<span class="header_email">email@example</span>
				</div>
				<div class="col-md-6">
					<ul>
						<li>1</li>
						<li>2</li>
						<li>3</li>
					</ul>
				</div>
			</div>
		</div>
	</div>

Answer 1

根据我的测试结果，看看Ms-flex和flex创建此问题。

如果你删除它可以正确显示菜单。

Answer 2

您应该尝试使用BS示例作为基础，然后根据自己的喜好调整颜色等。 This page has many examples of top navbars.您可以轻松地添加和减去类，以更改固定位置，背景颜色等。

您也可以使用BS margins and padding而不是为自己添加额外的工作。

本质上杠杆BS尽可能做你需要的。

Answer 3

<style>

.top_bar ul{
	text-align: right;
	margin-top:-4px;
    width:100%;
}

.top_bar ul li{
	display:inline-block;
}
</style>

<div class="col-md-6" style="float:left">
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
	</ul>
</div>