Expand generic tables to 100%; remove hack to hide horizontal scrollbar

app/assets/stylesheets/content/_table.sass

@@ -205,15 +205,18 @@ table.generic-table
     white-space: nowrap
     width:   100%
     clear:   both
-    display: table
+    display: block
 
     & > a,
     & > span
-      display: table-cell
+      display: block
       font-weight: bold
       overflow: hidden
       text-overflow: ellipsis
-      max-width: 0px
+
+    & > a
+      float: left
+      width: calc(100% - 18px)
 
     & > .dropdown-indicator
       width: 1em

app/assets/stylesheets/layout/_toolbar.sass

@@ -40,6 +40,9 @@
   margin: 0.625rem 0 0
   @extend %input--sizing
 
+.toolbar
+  padding: 0 10px 0 0
+
 .toolbar-container
   padding: 0
   margin-bottom: 12px

app/assets/stylesheets/layout/_work_package.sass

@@ -253,11 +253,6 @@
     .form--field-container
       max-width: 400px
 
-.work-package-table--container
-  table.generic-table
-    // HACK: This prevents a horizontal scroll bar in the work package table when there is nothing to scroll
-    width: calc(100% - 20px)
-
 %flex-grow-shrink-zero
   flex-grow: 0
   flex-shrink: 0

frontend/app/ui_components/interactive-table-directive.js

@@ -80,16 +80,9 @@ module.exports = function($timeout, $window){
         } else {
           // ensure table stretches to container sizes
           getInnerContainer().css('width', '100%');
-          if(isWorkPackagesTable()) {
-            // HACK: This prevents a horizontal scroll bar in
-            //       the work package table when there is nothing to scroll
-            getBackgrounds().css('width', 'calc(100% - 20px)');
-          }
-          else {
           getBackgrounds().css('width', '100%');
         }
       }
-      }
 
       function setHeaderFooterWidths() {
         getHeadersFooters().each(function() {