Show the dropdown options in the header and take the search bar off the menu in the mobile view

Question

Show the dropdown options in the header and take the search bar off the menu in the mobile view

Navigation

#1 by (0 votes)

0

I have a header that, in the mobile view, does not show dropdown options, and the main option is not clickable. I would like the menu options to be displayed and the search bar would also be outside the menu, also in the mobile view.

Below is the header and menu

Header

Menu

css ruby-on-rails header menu dropdown

asked by anonymous 09.10.2018 / 19:10

1 answer

Accentuation problem when doing mysql Dump in C # (latin1 and utf8) Combobox with pagination giving error while doing reload.

score 0 · Answer 1

In the menu, if you are using Bootstrap 4, this is the button that is in the mobile version. The only difference I found in your code was navbar-toggle (in my navbar-toogler ). But I do not know if that's it. Among the most important settings of this menu is the data-target which basically points to the ID in the menu that collapses.

<button
  className="navbar-toggler"
      type="button"
      data-toggle="collapse"
      data-target="#navbarSupportedContent"
      aria-controls="navbarSupportedContent"
      aria-expanded="false"
      aria-label="Toggle navigation">
 <span class="navbar-toggler-icon" />

The menu that collapses is something like this

<div class="collapse navbar-collapse text-center" id="navbarSupportedContent">
   <ul>
    <li></li>
    <li></li>
   </ul>
</div>