examples: Make source code and console tabs take 80% of browser page.

Fixes #14997.

(cherry picked from commit 3d2af859348b0eddf9f465b96ac3c09a929bd6cc)

examples/template.html

@@ -92,7 +92,7 @@
 
       #output-container:hover,
       #output-container:focus-within {
-        top: 50%;
+        top: 20%;
       }
 
       #output-container:focus-within {
@@ -151,7 +151,7 @@
 
       #source-code:hover,
       #source-code:focus-within {
-        top: 50%;
+        top: 20%;
       }
 
       #source-code:focus-within {
@@ -241,7 +241,7 @@
           return function(text) {
             var elem = document.getElementById('output-container');
             if (elem.style['top'] == '') {
-                elem.style['top'] = '50%';
+                elem.style['top'] = '20%';
                 setTimeout(function() { elem.style['top'] = ''; }, 3000);
             }