How to change Chrome's tab indention width?

Question

For personal reasons, I use tabs instead of spaces to indent my code. I occasionally view my web page's source code in Chrome's view-source: tab. When I do, my tabs are 8 spaces in width. I would like to change it to 2 spaces. I cannot figure out how to change this default behavior. To no avail, I've tried searching online and browsing through Chrome's settings. A "feature request" is located here but that post is almost 5 years old.

My question is: how do I change Chrome's default tab indention of 8 spaces to 2 spaces?

Answer 1

I'm afraid support for the aforementioned solution's been dropped as of Chrome 33. See the following post: http://www.reddit.com/r/chrome/comments/1ymfgw/

After some cursory snooping through angry discussion lists, I concluded there was no way of customising the view-source page's formatting short of writing a full-blown extension. Which, of course, is overkill for something as menial as tweaking indentation width.

As a (hopefully temporary) fix, I've simply added the following bookmarklet to my bookmarks bar, and habitually run it whenever I find myself developing vertigo poking through hideously misaligned source code:

javascript:(function(){document.body.style.tabSize = 4;}());

Just change "tabSize = 4;" to whatever your desired indentation width is, and voilà! ;) Sure as heck not the most elegant or ergonomic approach, but certainly the quickest and easiest.

---

EDIT: Here's a variant of the bookmarklet that works globally (rather than limiting itself to Chrome's "view-source" view):

javascript:(function(){for(var i=0,l=document.all.length;i<l;++i)document.all[i].style.tabSize=4;}());

I've moved the bookmarklet to my main bookmarks bar and assigned it a neat, conservative name so I can hit it repeatedly while browsing GitHub. :) Who, mind you, could really do with implementing a "Tab Size" setting for repositories - so developers can tailor the reader's viewing experience based on their coding habits.

Answer 2

I know I'm somewhat late to the party, but I just noticed Chrome has tab-width set to 8 which is incredibly ridiculous.

If you use Stylish, an extension which, in my opinion, is absolutely necessary to correct poor design-choices with websites ( such as hiding the posted / replied time unless you hover over the post and then requires you to wait a second or two while it fades in, etc... ), bugs with sites ( such as not allowing center-button-scrolling because as soon as you push the button on the background image instead of text / url to avoid opening a new tab, you get a popup ) etc...

Create a new script > Name it what you want and paste this:

body {
    tab-size: 4;
}

Incredibly easy but essential...