Note that there are some explanatory texts on larger screens.

plurals
  1. POTwitter boostrap nav-collapse: multiple items on one line?
    primarykey
    data
    text
    <p>The responsive functionality of bootstrap's navbar is <em>awesome</em> but it is really aggressive about taking each individual item and placing it in its own line in the collapsed menu, for example:</p> <pre><code> &lt;div class="nav-collapse"&gt; &lt;ul class="nav pull-left"&gt; &lt;li&gt;&lt;a id="mpd_header_playlist" href="/"&gt;Now Playing&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a id="mpd_header_playlists" href="/playlists"&gt;Playlists&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;ul class="nav pull-right"&gt; &lt;li&gt;&lt;a href="#"&gt;Volume:&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a style="width:100px; valign:middle;"&gt;&lt;div id="mpd_header_volume"&gt;&lt;/div&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-step-backward icon-white mpd_previous_button"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-play icon-white mpd_play_button"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-pause icon-white mpd_pause_button"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-stop icon-white mpd_stop_button"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-step-forward icon-white mpd_next_button"&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Search Music&lt;/a&gt;&lt;/li&gt; &lt;li class=""&gt; &lt;form class="navbar-search" id="search" action="search"&gt; &lt;input type="text" name="q" class="search-query" placeholder="Search Library..." /&gt; &lt;/form&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt;&lt;!--/.nav-collapse --&gt; </code></pre> <p>produces a line in the collapsed menu for each and every <code>&lt;li&gt;</code> listed, when really, I'd like a line for the header and playlist links, and a line for all the icons that makeup the play controls. Is there a way to "group" items so they are collapsed smartly by the responsive navbar?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload