我的目标是生成一个导航/菜单栏,它具有居中的图像,但会缩小以适应其内容。我现在设计的方式,如果页面缩小,<li>
不适合的项目最终会被推到下一行,使导航栏更高。所有 li 项目和图像都应缩小以保持导航容器的高度为其大小,并且仅填充页面,而不是溢出。
示例:http: //jsfiddle.net/t5P7y/
<div class="container">
<div class="nav-bar">
<ul class="nav-ul">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li><img src="../Logo.png"></li>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
</ul>
</div>
</div>