Simple question, is there a way to customize the Site Tree's width when editing a page? Further, is there a way to make the width draggable? This would be very useful when editing blog posts - the default width is too skinny.

I was also going to write a post on this subject. The element <div id="cms-content-tools-CMSMain"> really needs to be wider by default. If this area is a ModelAdmin search area that has an import field then the Browse button is always cut off. If it is a site tree listing then the status of the page is cut off or not visible if the page name is too long. Being able to resize this is extremely important.

There is a months-old open ticket on this (not started by me): https://github.com/silverstripe/silverstripe-framework/issues/1565

This really is something that needs to be addressed. The width of the site tree needs to be dynamic - at the very least, a higher 'min-width' value needs to be applied. I've tried to fix it myself, but the relevant CSS seems to be inline so I'm assuming it's injected via javascript at some point - but I can't find where. Any pointers?

My solution:

Create a CSS file myLocalCMSStyles.css, and add

.cms-content-tools .cms-panel-content {
    width: 284px;
}

(replace with your desired with; this will set it to 300px when all the padding/margins are added). The javascript that injects the styling into the element inline consults the stylesheet for the inner element, so that's how we can get a foothold.

Then, in _config.php, add a line:

 LeftAndMain::require_css('path/to/myLocalCMSStyles.css');

Do a ?flush=1, and your SiteTree menu should now be wider.