bootstrapレスポンシブでブレイクポイントを過ぎても画面サイズが縮小しない。

アプリの全てのviewでレスポンシブが正しく実行されません。画面サイズが縮小するとともに横スクロールが現れ元画面のサイズを保持しようとしているようです。但し、bootstrapで作成したナビバーのリンクはハンバーガーアイコンに変化します。具体的には以このリンク-myAppを見てください。

スマホサイズになるとtableを書き換える仕様です。
レスポンシブを何かが邪魔しているのですがよく分かりません。

参考になるサイトも少なく、どこを見れば良いのか、どこをいじれば良いのかヒントになるご助言頂けると嬉しいです。

gemfile

gem 'pry-rails'
gem 'compass-rails','~> 2.0'
gem 'sprockets', '2.11.0'
gem 'hirb'
gem 'hirb-unicode'
gem 'roo'

gem 'twitter-bootstrap-rails'
gem 'therubyracer'
gem 'less-rails', '~> 2.8.0'
gem 'rubyzip'
gem 'aws-sdk'
gem 'carrierwave', github: 'carrierwaveuploader/carrierwave'
gem 'zipline'
gem 'jquery-ui-rails'
gem 'devise'
gem 'devise-i18n'
gem 'devise-bootstrap-views'
gem 'gon'

stylesheets/application.scss

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 
 *= require_tree .
 *= require_self
 *= require jquery-ui
 @import "bootstrap";
 */

stylesheets/bootstrap_and_overrides.css.less

@import "twitter/bootstrap/bootstrap";

// Set correct font paths
@glyphiconsEotPath: font-url("glyphicons-halflings-regular.eot");
@glyphiconsEotPath_iefix: font-url("glyphicons-halflings-regular.eot?#iefix");
@glyphiconsWoffPath: font-url("glyphicons-halflings-regular.woff");
@glyphiconsTtfPath: font-url("glyphicons-halflings-regular.ttf");
@glyphiconsSvgPath: font-url("glyphicons-halflings-regular.svg#glyphicons_halflingsregular");

// Set the Font Awesome (Font Awesome is default. You can disable by commenting below lines)
@fontAwesomeEotPath: font-url("fontawesome-webfont.eot");
@fontAwesomeEotPath_iefix: font-url("fontawesome-webfont.eot?#iefix");
@fontAwesomeWoffPath: font-url("fontawesome-webfont.woff");
@fontAwesomeTtfPath: font-url("fontawesome-webfont.ttf");
@fontAwesomeSvgPath: font-url("fontawesome-webfont.svg#fontawesomeregular");

// Font Awesome
@import "fontawesome/font-awesome";

// Glyphicons
@import "twitter/bootstrap/glyphicons.less";

// Your custom LESS stylesheets goes here
//
// Since bootstrap was imported above you have access to its mixins which
// you may use and inherit here
//
// If you'd like to override bootstrap's own variables, you can do so here as well
// See http://twitter.github.com/bootstrap/customize.html#variables for their names and documentation
//
// Example:
@link-color: #ff0000;
// 20181114comment in

view/layout/application.html.erb

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title><%= content_for?(:title) ? yield(:title) : "DistributeImage" %></title>
    <%= csrf_meta_tags %>
    
    <%= stylesheet_link_tag "application", :media => "all" %>

    <!-- For third-generation iPad with high-resolution Retina display: -->
    <!-- Size should be 144 x 144 pixels -->
    <%= favicon_link_tag 'apple-touch-icon-144x144-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png', :sizes => '144x144' %>

    <!-- For iPhone with high-resolution Retina display: -->
    <!-- Size should be 114 x 114 pixels -->
    <%= favicon_link_tag 'apple-touch-icon-114x114-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png', :sizes => '114x114' %>

    <!-- For first- and second-generation iPad: -->
    <!-- Size should be 72 x 72 pixels -->
    <%= favicon_link_tag 'apple-touch-icon-72x72-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png', :sizes => '72x72' %>

    <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
    <!-- Size should be 57 x 57 pixels -->
    <%= favicon_link_tag 'apple-touch-icon-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png' %>

    <!-- For all other devices -->
    <!-- Size should be 32 x 32 pixels -->
    <%= favicon_link_tag 'favicon.ico', :rel => 'shortcut icon' %>
    <%= favicon_link_tag %>
    

    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
    <!--[if lt IE 9]>
    <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js" type="text/javascript"></script>
    <![endif]-->
    <%= Gon::Base.render_data %>
    <%= javascript_include_tag "application" %>
  </head>
  <body>
    <% if user_signed_in? %>
    <div class="navbar navbar-default navbar-static-top">
      <div class="container">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">DistributeImage</a>
        <div class="navbar-collapse collapse navbar-responsive-collapse">
          <ul class="nav navbar-nav">
            <li><%= link_to "一括ダウンロード", downloads_user_indices_path(@user), download: "" %></li>
            <li><%= link_to 'ログアウト', destroy_user_session_path, :method=>'delete' %></li>
            <li><%= link_to "退会", '/users', :method=>'delete', data: {confirm: "すべての映像がなくなります。本当に削除しますか？"} %></li>
          </ul>
        </div>
      </div>
    </div>
    <% else %>
      <div class="navbar navbar-default navbar-static-top">
      <div class="container">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">DistributeImage</a>
        <div class="navbar-collapse collapse navbar-responsive-collapse">
          <ul class="nav navbar-nav">
            <li><%= link_to 'ログイン', new_user_session_path %></li>
            <li><%= link_to 'ユーザ登録', new_user_registration_path %></li>
            <li><%= link_to 'パスワード再発行', new_user_password_path %></li>
          </ul>
        </div>
      </div>
      </div>
    <% end %>
    
      <footer>
        <p>&copy; distributeImage 2018</p>
      </footer>

    </div> <!-- /container -->

  </body>
</html>