0

真的被这个难住了，可能是我有点昏暗。

考虑这个html：

        <div id="ebt_info_nav">
            <ul>
                <li><a href="#"><i class="icon-h"></i> Home</a></li>
                <li><a href="#"><i class="icon-i"></i> FAQ</a></li>
                <li><a href="#"><i class="icon-s"></i> Feedback</a></li>            
                <li><a href="#"><i class="icon-b"></i> Bookmark Us</a></li>
                <li><a href="#"><i class="icon-c"></i> Contact Us</a></li>
</ul>


        <div id="ebt_search">
            <form method="post" action="#">
            <input type="text" name="search" placeholder="Search" /><button class="ebt_input_button"><i class="icon-search"></i></button>
            </form>
        </div><!-- / End #ebt_search -->

    <div class="ebt_clear"></div>

</div> <!-- / End #ebt_info_nav -->

这个CSS：

#ebt_info_nav {
width: 98%;
line-height:30px;
margin: 0 1% 1% 1%;
background: #336699;
border-radius: 6px;
background: -moz-linear-gradient(90deg, rgb(44, 85, 128) 0%, rgb(51, 102, 153) 100%);
background: -webkit-linear-gradient(90deg, rgb(44, 85, 128) 0%, rgb(51, 102, 153) 100%);
background: -o-linear-gradient(90deg, rgb(44, 85, 128) 0%, rgb(51, 102, 153) 100%);
background: -ms-linear-gradient(90deg, rgb(44, 85, 128) 0%, rgb(51, 102, 153) 100%);
background: linear-gradient(0deg, rgb(44, 85, 128) 0%, rgb(51, 102, 153) 100%); 
padding: 0.5% 0;   
} 


#ebt_info_nav ul {
margin: 0 0 0 10px;
padding: 0;
float: left;
width: 70%;
}

#ebt_info_nav ul li {
list-style-type: none;
float: left;
margin: 0 0.25%;
font-family: 'Open Sans', sans-serif;
font-size: 1.1em;
} 

#ebt_info_nav ul li a {
display:inline-block;
text-decoration: none;
color: #fff;
padding: 0.5% 3%;
text-shadow: 1px 1px #003366;
} 

#ebt_info_nav ul li a:hover {
background: #fff;
color: #336699;
border-radius:6px;
text-shadow: none;
}  

#ebt_search { 
float: right;
padding: 0 1%;
}

图片在这里 http://i44.tinypic.com/2v9aphl.png

为什么 IE 10 会使项目换行或用换行符替换空格？我已经删除了 fontello 图标，但它仍然只发生在文本中。

任何指点将不胜感激。

4

1 回答 1

0

从你给我们的来看，我认为你的意思是这样的？

http://codepen.io/anon/pen/eIfiF

对不起，让我告诉你我做了什么。

为了让它停止断裂并走上一条新线，我拿走了小%填充物，这样display:inline-block做是为了让它更适合而不是float:left;

如果您需要/想要保留float:left属性，您可以简单地删除这一行，它/应该/工作：

padding: 0.5% 3%;

于 2013-07-26T15:52:12.827 回答