Как выровнять input в top bar Foundation вертикально по центру?

Question

[Wasya UK]

В данном вопросе я не очень, буду рад всем подсказкам и замечаниям)

<header id="header" class="top-bar stacked-for-medium">
  <div class="top-bar-left">
    <nav class="menu" id="responsive-navigation" data-dropdown-menu>
      <li class="logo menu-text">
        <div class="">
          <img src="public/images/logo.png" alt="" class="">
        </div>
      </li>
      <li><a href="#">сохраненные</a></li>
      <li><a href="#">случайное</a></li>
      <li><a href="#">настройки</a></li>
      <li><a href="#">справка</a></li>
    </nav>
  </div>
  <div class="top-bar-right">
    <form action="" id="main-search">
      <input type="text" placeholder="Поиск...">
    </form>
  </div>
</header>

Получилось вот что:


Как выровнять поисковую строку вертикально по центру?
Можно ли средствами ZURB Foundation при уменьшении сделать поисковою строку на всю ширину?

Comments

[Ankhena]

выравнивание по центру

[Wasya UK]

Ankhena, а средствами foundation?

[Ankhena]

Wasya UK, так

[Wasya UK]

Ankhena, Эта штука правильно не работает: ( поиск вылезает за пределы )

#main-search {
  position: relative;
}

#main-search input {
  border-radius: 1rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

Думаете я не умею пользоваться поисковиком? Просто не могу понять как использовать, ибо любые манипуляции с display не дают нормальных результатов. Подумал на форуме подскажут, а эти сайты я и без вас нашел!

[Ankhena]

Wasya UK,

Подумал на форуме подскажут,

Вы ш поймите нас убогих, сложно без кода в песочнице jsfiddle или ссылки на сайт, а только по скринам узнать что у вас там с остальными стилями.

[Wasya UK]

Ankhena, Ой, простите глупца. Я ж не знал, что вам сложно попросить кинуть больше кода.

[Ankhena]

Wasya UK, ну вы ш не первый день верстаете, наверное можно догадаться, что если вы погуглили и не нашли очевидного решения, то дело в соседнем коде и надо смотреть его.

[Ankhena]

Wasya UK, А так, решение нашлось и славно.
Хорошего вечера :)

[Wasya UK]

Ankhena, ну да, только найти подходящий на foundation в попу сложно, я пытался, но увы мои попытки четны(

Answer 1

[Wasya UK]

Кароче... пришлось использовать простой margin, ибо норм ответов не нашел:

#main-search input {
  border-radius: 1rem;
  width: 100%;
  max-width: 100%;
  margin-top: 1rem;
}