我想在CSS中创建一个漂亮的，本质上简单的菜单 . 在Chrome中它看起来不错，但在ff中它看起来很糟糕 .
假设我有导航层（40px高度，宽度100％）：
<nav id="navbar">
<div class="main-navigation">
<ul> (list-style:none;)
<li><a href="#">Home</a></li>
<li><a href="#">Page1</a></li>
<li><a href="#">Page2</a></li>
<li><a href="#">Page3</a></li>
<li><a href="#">Page4</a></li>
</ul>
<div class="search">
<form method="get" action="">
<input type="text" name="q" class="search-input" placeholder="Type here" />
<input type="submit" class="search-btn" value="Search" />
</form>
</div>
</div>
</nav>
我希望所有按钮的高度为30px，字体大小：14px;和border-radius：5px;并搜索输入和提交按钮（输入 - 高度30px; border-radius：5px 0 0 5px;提交 - 高度30px; border-radius：0 5px 5px 0;）
有没有办法将它们定位在一条相等的线上？
非常感谢
1 回答
内联块是您的最佳选择 . 这是一个小小的思维调整，但非常值得 . Re-fiddled