Como bloquear o empilhamento de divs usando bootstrap

Front-end
,
#1

Eu preciso que quando a tela diminua as divs nao empilhem. Segue codigo atual.

Obs: No meu projeto tenho o problema de algumas aplicações terem muitos links, e quando eu uso esse padrão em algumas acaba passando do limite do menu, aí tenho que consertar isso, estive pensando em bloquear as divs para nao empilharem e tratar de alguma forma quando tiver muitos links, não posso usar menu dropdown por motivos institucionais. Só que estou com esse problema das divs

  <div class="col-xs-2"><!-- INICIO DA DIV LOGO DO PROJETO -->
    {{#link-to 'admin' class='navbar-brand'}}
      <img src="favicon.ico">
    {{/link-to}}
    {{#link-to 'admin' class='navbar-brand' id="appName"}}
      {{app-name}}
    {{/link-to}}
  </div><!-- FIM DA DIV LOGO DO PROJETO -->

  <div class="col-xs-8"><!-- INICIO DA AREA DE LINKS DO PROJETO -->
    <ul class="nav navbar-nav">
      {{#each recursos as |recurso|}}
        <li>
          <a role="button" class="{{recurso.nome}}" {{action 'changeModel' recurso.nome}}>
            <span class="glyphicon" aria-hidden="true"/>
            {{t-model recurso.nome}}
          </a>
        </li>
      {{/each}}
    </ul>

    <ul class="nav navbar-nav">
      {{#each recursos as |recurso|}}
        <li>
          <a role="button" class="{{recurso.nome}}" {{action 'changeModel' recurso.nome}}>
            <span class="glyphicon" aria-hidden="true"/>
            {{t-model recurso.nome}}
          </a>
        </li>
      {{/each}}
    </ul>
  </div><!-- FIM DA AREA DE LINKS DO PROJETO -->

  <div class="col-xs-2 pull-right"><!-- INICIO DA AREA USUARIO -->
    {{#if aplicacoes}}
      <a role="button" class="dropdown-toggle btn-link btn btn-defaul navbar-btn" id="user" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        <span class="glyphicon glyphicon-cog" aria-hidden="true"/>
      </a>
        <ul class="dropdown-menu" aria-labelledby="aplicacoes">
           <div class="col-xs-12">
            {{#each aplicacoes as |aplicacao|}}
                <div class="col-xs-6 icones text-center">
                  <a href={{aplicacao.endereco}} class="aplicacao.nome" >
                    <img  title="{{aplicacao.nome}}" class="icon-tamanho-endereco" src="{{aplicacao.endereco}}/icon.png"  aria-hidden="true">
                    </a>
                </div>
             {{/each}}
           </div>
            <li id="linha-pular"><a id="separador"></a></li>
            <li class="divider"></li>
              <li class="drop-user" >
                <a href="#">
                  {{#if session.isAuthenticated}}
                    {{#link-to 'model-records.edit' 'usuario' user.id role='button' class='btn-link btn btn-defaul navbar-btn' id="user-name-drop"}}
                      <span class="glyphicon glyphicon-user" aria-hidden="true"/>
                      {{user.name}}
                    {{/link-to}}
                   {{/if}}
                </a>
           </li>
        </ul>
      {{/if}}
      {{#if session.isAuthenticated}}
      <button id="logout" {{ action 'invalidate' }} class="btn btn-danger navbar-btn">
        <span class="glyphicon glyphicon-log-out" aria-hidden="true"/>
        {{t 'logout'}}
      </button>
    {{/if}}
  </div><!-- FIM DA AREA USUARIO -->
#2

Você precisa que as DIV’s sejam mantidas uma na frente da outra em qualquer resolução?

#3

Não necessariamente, eu quero que quando o usuario diminua a tela, as divs possam diminuir junto, mas nao ficar uma em cima da outra, elas precisam continuar uma no lado da outra na horizontal