AMBARI-10146. Implement config-section layout within a config tab - horizontal scroll fix (Richard Zang via srimanth)

ambari-web/app/styles/application.less

@@ -5552,29 +5552,32 @@ input[type="checkbox"].align-checkbox {
   }
 }
 
-.section-layout-container {
-  width: 104%; // fallback option
-  width: ~"calc(100% + 40px)";
-  .config-section-table {
-    width: 100%;
-    height: 100%;
-    border-spacing: 20px;
-    border-collapse: separate;
-    table-layout: fixed; // for width to be equally distributed
-    margin: 0 -20px;
-    .config-section {
-      padding: 10px;
-      border: 1px solid #aaa;
-      td:not(:first-of-type) {
-        border-left: 2px solid #ccc; // horizontal splitter
-        padding-left: 20px;
-      }
-      .config-subsection-table {
-        width: 100%;
-        height: 100%;
-        border-spacing: 5px;
-        border-collapse: separate;
-        table-layout: fixed;
+.enhanced-config-tab-content {
+  overflow: hidden;
+  .section-layout-container {
+    width: 104%; // fallback option
+    width: ~"calc(100% + 40px)";
+    .config-section-table {
+      width: 100%;
+      height: 100%;
+      border-spacing: 20px;
+      border-collapse: separate;
+      table-layout: fixed; // for width to be equally distributed
+      margin: 0 -20px;
+      .config-section {
+        padding: 10px;
+        border: 1px solid #aaa;
+        td:not(:first-of-type) {
+          border-left: 2px solid #ccc; // horizontal splitter
+          padding-left: 20px;
+        }
+        .config-subsection-table {
+          width: 100%;
+          height: 100%;
+          border-spacing: 5px;
+          border-collapse: separate;
+          table-layout: fixed;
+        }
       }
     }
   }

ambari-web/app/views/common/configs/service_config_layout_tab_view.js

@@ -22,6 +22,7 @@ App.ServiceConfigLayoutTabView = Em.View.extend({
 
   templateName: require('templates/common/configs/service_config_layout_tab'),
 
+  classNames: ['enhanced-config-tab-content'],
   /**
    * ConfigType-Widget map
    * key - widget type
@@ -62,7 +63,8 @@ App.ServiceConfigLayoutTabView = Em.View.extend({
     });
   },
 
-  beforeRender: function () {
+  willInsertElement: function () {
+    this._super();
     this.prepareConfigProperties();
   }