set the plotly-container div to full width & height

Author: samhinshaw

Diff for: src/plot_api/plot_api.js

@@ -3704,7 +3704,15 @@ function makePlotFramework(gd) {
     fullLayout._container.enter()
         .insert('div', ':first-child')
         .classed('plot-container', true)
-        .classed('plotly', true);
+        .classed('plotly', true)
+        // The plot container should always take the full with the height of its
+        // parent (the graph div). This ensures that for responsive plots
+        // without a height or width set, the paper div will take up the full
+        // height & width of the graph div.
+        .style({
+            width: "100%",
+            height: "100%"
+        });
 
     // Make the svg container
     fullLayout._paperdiv = fullLayout._container.selectAll('.svg-container').data([0]);

Diff for: src/plot_api/subroutines.js

@@ -52,6 +52,14 @@ function lsInner(gd) {
     var axList = Axes.list(gd, '', true);
     var i, subplot, plotinfo, ax, xa, ya;
 
+    // Set the width and height of the paper div ('.svg-container') in
+    // accordance with the users configuration and layout. 
+    // If the plot is responsive and the user has not set a width/height, then
+    // the width/height of the paper div is set to 100% to fill the parent
+    // container. 
+    // We can't leave the height or width unset because all of the contents of
+    // the paper div are positioned absolutely (and will therefore not take up
+    // any space).
     fullLayout._paperdiv.style({
         width: (gd._context.responsive && fullLayout.autosize && !gd._context._hasZeroWidth && !gd.layout.width) ? '100%' : fullLayout.width + 'px',
         height: (gd._context.responsive && fullLayout.autosize && !gd._context._hasZeroHeight && !gd.layout.height) ? '100%' : fullLayout.height + 'px'