Меню CSS с полем поиска - Chrome, FF и IE - PullRequest
0 голосов
/ 13 марта 2012

Я хотел создать красивое, по своей сути простое меню в css. В хроме это выглядит нормально, но в ff это выглядит ужасно.

допустим, у меня есть слой навигации (высота 40 пикселей, ширина 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; и радиус границы: 5 пикселей; и поиск кнопки ввода и отправки (input - высота 30px; border-radius: 5px 0 0 5px; submit - высота 30px; border-radius: 0 5px 5px 0;)

есть ли способ разместить их так, чтобы они отображались в одной, равной строке?

большое спасибо

1 Ответ

0 голосов
/ 14 марта 2012

Inline-block - ваша лучшая альтернатива. Это небольшое изменение в мышлении, но оно того стоит. Re-вертел

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...