WordPress 2014 Theme Modification

The Issue

The WordPress 2014 Theme is fairly cool, but the sizing has some shortcomings, so here's a top tip from me, based on this author's information.  The width for this theme is hard coded in pixels.  Doing it as a percentage makes way more sense.  Instead of changing the original values in the CSS file, I added them to the 'Additional CSS' in theme via the GUI, as they override what's in the CSS files.

.site {max-width: 100%}
.site-header {max-width: 100%}
.site-content .entry-header,
.site-content .entry-content,
.site-content .entry-summary,
.site-content .entry-meta,
.page-content {
margin: 0 auto;
max-width: 80%;
}

I also changed the width of the header image by editing the custom-header.php file in the themes 'inc' directory.  There are two values set to 1260, so I changed them to 3600.  The height, 240, only appears in one spot, and I changed it to 420.  I recommend a big number as the image will automatically resize smaller.

I also discovered that the TinyMCE editor tries its best to do the WYSIWYG thing by adjusting the size of the text editing area.  A WordPress user might experience this with themes that have narrow text areas like the 2014 theme.  So to solve that I just searched all files in the theme directory for 474px and added those to the 'Additional CSS' section of the theme.