Merge pull request #7721 from jdfreder/widecontents2

Prevent image outputs from being wider than their container.

IPython/html/static/notebook/less/outputarea.less

@@ -131,6 +131,13 @@ div.output_png {
 div.output_jpeg {
 }
 
+// Prevent the image outputs from being wider than the page.
+div.output_png div.ui-wrapper, 
+div.output_svg div.ui-wrapper, 
+div.output_jpeg div.ui-wrapper {
+    max-width: 100%
+}
+
 /* Empty output_javascript divs should have no height */
 div.output_javascript:empty {
     padding: 0;

IPython/html/static/style/ipython.min.css

@@ -897,6 +897,11 @@ div.output_stderr {
 div.output_latex {
   text-align: left;
 }
+div.output_png div.ui-wrapper,
+div.output_svg div.ui-wrapper,
+div.output_jpeg div.ui-wrapper {
+  max-width: 100%;
+}
 /* Empty output_javascript divs should have no height */
 div.output_javascript:empty {
   padding: 0;

IPython/html/static/style/style.min.css

@@ -9673,6 +9673,11 @@ div.output_stderr {
 div.output_latex {
   text-align: left;
 }
+div.output_png div.ui-wrapper,
+div.output_svg div.ui-wrapper,
+div.output_jpeg div.ui-wrapper {
+  max-width: 100%;
+}
 /* Empty output_javascript divs should have no height */
 div.output_javascript:empty {
   padding: 0;