New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

pre { tab-size: 4 } #170

Open
Rich-Harris opened this Issue Apr 17, 2014 · 131 comments

Comments

Projects
None yet
@Rich-Harris
Copy link

Rich-Harris commented Apr 17, 2014

For some unfathomable reason, browsers render tabs as 8 spaces. Even among the minority of developers who agree that tabs > spaces, I've yet to find anyone who thinks that makes sense.

Happily, most browsers allow you to set the tab width with the CSS tab-size property. Adding something like the following to the CSS used on github.com and gist.github.com would make code previews much more readable:

pre {
  -moz-tab-size: 4;
  tab-size: 4;
}
@nschonni

This comment has been minimized.

Copy link

nschonni commented Apr 17, 2014

👍 I find it annoying too. I reached out to GitHub about this when they decided to drop tab characters entirely (now restored). The hack they shared was to add ?ts=4 to the URL to override the value. EX https://github.com/wet-boew/wet-boew/blob/master/Gruntfile.coffee?ts=4

@Rich-Harris

This comment has been minimized.

Copy link

Rich-Harris commented Apr 17, 2014

@nschonni Thanks, didn't know that. Weird that they'd implement that but not have a sensible default! Also, it doesn't work on gist.github.com sadly

@nschonni

This comment has been minimized.

Copy link

nschonni commented Apr 17, 2014

Not to hijack the request, but it would be nice to be able to set your preference in your user profile or by project

@rlidwka

This comment has been minimized.

Copy link

rlidwka commented Apr 18, 2014

it would be nice to be able to set your preference in your user profile or by project

+1

@Rich-Harris

This comment has been minimized.

Copy link

Rich-Harris commented Apr 18, 2014

From GitHub:

Hi Rich,

Thanks for your feedback! We're always working to improve GitHub and we consider every suggestion we receive. I've added your idea about changing the tab spacing on GitHub to four to our internal Feature Request List.

We can't say if/when we may add a feature, however your feedback has definitely been recorded.

Cheers,
Steven!

@tobiasvl

This comment has been minimized.

Copy link

tobiasvl commented Apr 19, 2014

👍

1 similar comment
@bevacqua

This comment has been minimized.

Copy link

bevacqua commented Apr 29, 2014

👍

@sindresorhus

This comment has been minimized.

Copy link

sindresorhus commented May 3, 2014

I suggested this in early april and got this response from GitHub:

Would you mind adding tab-size: 4; to your
pre {} rule? It makes tab sized indentation
have sane indentation (4 char instead of 8)
in diff views.

We have discussed this many times but we find 8 to be the safest option. Some browsers only support the default, which is 8. Also, changing the default would break repositories that mix spaces and tabs, like ruby/ruby for example.

We haven’t given up on this though. We still want to find a solution, but we need to find a solution that fixes this without creating new problems.

@bkeepers

This comment has been minimized.

Copy link

bkeepers commented May 16, 2014

We actually do use tab-size in CSS now, but it's still 8 because people get 😠 when you change stuff like that on them.

I just proposed to the team that we persist the ?ts=4 param per-user. So you only have to visit it once and it changes it for you forever. I haven't fully thought through the idea, so maybe it's a horrible idea. But we'll see what the consensus is.

@Rich-Harris

This comment has been minimized.

Copy link

Rich-Harris commented May 16, 2014

@bkeepers That sounds to me like a winning solution - grants all the customisability without having to crowbar in extra complexity to the account settings page. Fingers crossed your colleagues go for it. Thanks!

@sindresorhus

This comment has been minimized.

Copy link

sindresorhus commented May 16, 2014

We actually do use tab-size in CSS now, but it's still 8 because people get 😠 when you change stuff like that on them.

Even if it's a good change that most will want? As an example, Facebook has changed their design a lot, people got angry, but in the end everyone got used to it, and most even found it better. Just saying.

@bkeepers

This comment has been minimized.

Copy link

bkeepers commented May 16, 2014

Even if it's a good change that most will want?

I'm all for changing it then, but we don't really have an easy way to quantify that besides gut feeling. We could take time to research it, but honestly I would rather just make ts sticky and move on to something more productive.

@nschonni

This comment has been minimized.

Copy link

nschonni commented May 16, 2014

The way to quantify would be the feedback you received last time you completely replaced tabs with spaces in the diffs and the feedback that got 😉

@tj

This comment has been minimized.

Copy link

tj commented Jun 3, 2014

big +1 to changing this it looks ridiculous right now

@narirou

This comment has been minimized.

Copy link

narirou commented Jul 3, 2014

+1!
Some projects are sharing the information of the tab size by .editorconfig.
If it is possible to apply this information, not break the display that mix spaces and tabs?

@indexzero

This comment has been minimized.

Copy link

indexzero commented Jul 24, 2014

Yes. Please.

@mehulkar

This comment has been minimized.

Copy link

mehulkar commented Jul 30, 2014

👍

@sindresorhus

This comment has been minimized.

Copy link

sindresorhus commented Aug 3, 2014

I made a quick Chrome extension that fixes this: https://github.com/sindresorhus/github-tab-size

Still hoping for GitHub to fix it themselves though.

refined-github also includes a fix for this.

@gwgundersen

This comment has been minimized.

Copy link

gwgundersen commented Aug 4, 2014

+1

@tj

This comment has been minimized.

Copy link

tj commented Aug 4, 2014

thou shalt not have nice tabs

@alganet

This comment has been minimized.

Copy link

alganet commented Sep 5, 2014

What about reading modelines?

@rlidwka

This comment has been minimized.

Copy link

rlidwka commented Sep 5, 2014

supporting .editorconfig is better than modelines, and it was suggested a while ago... still nothing

@f3cuk

This comment has been minimized.

Copy link

f3cuk commented Sep 7, 2014

Please change this or give us a good option to do it ourselves. Quantify? What about checking default tab size on decent editors like Notepad++, Sublime. After that check the default tab size on MS 👯

@izaakschroeder

This comment has been minimized.

Copy link

izaakschroeder commented Oct 2, 2014

+1 .editorconfig

@hrasoa

This comment has been minimized.

Copy link

hrasoa commented Oct 6, 2014

+1

@genbit

This comment has been minimized.

Copy link

genbit commented Oct 17, 2014

👍 for ?ts=4 only one time
👍 for .editorconfig

@avitex

This comment has been minimized.

Copy link

avitex commented Oct 21, 2014

+1

@RReverser

This comment has been minimized.

Copy link

RReverser commented Oct 23, 2014

Hi there, I've just published a browser extension that provides EditorConfig support for GitHub's code viewer and editor:

@tinco

This comment has been minimized.

Copy link

tinco commented Feb 13, 2017

It is defined here: https://www.w3.org/TR/CSS21/text.html#white-space-model and later redefined here: https://drafts.csswg.org/css-text-3/#tab-size-property. As to why it was defined that way.. no idea.

@anhlqn

This comment has been minimized.

Copy link

anhlqn commented Mar 18, 2017

What if I want indent style to be spaces instead of tabs? Would this work?

root = true

[*]
indent_style = space
indent_size = 4
@drydenp

This comment has been minimized.

Copy link

drydenp commented Mar 20, 2017

So happy this works. I would prefer a setting on GitHub and actually I would prefer the default to simply be changed to 4, because it seems ridiculous that any project depends on this being 8, why does Ruby/ruby have this as their config?

tab_width = 8
indent_style = tab
indent_size = 4

So they use an indent_size of 4, but a tab_width of 8. And indeed, files like Makefiles are displayed using 8 spaces. So GitHub apparently honours the tab_width parameter over indent_size in its display on GitHub for ruby/ruby. This means Ruby/ruby won't be hurt by setting the default to 4, because they've already overridden it with 8. Otherwise, it would be displayed as 4 seeing as indent_size would take effect.

So, the argument that ruby/ruby uses a size of 8 is already devoid because .editorconfig is now honoured and honoured well. This means that any actual projects that really care about this issue are already going to have a .editorconfig defined and they won't be hurt by a new default of 4. This leaves the door wide open for setting a better default, which I argue would be 4.

Particularly of course Ruby doesn't even use tabs in their main files.

So as others have said, a space-oriented project would dictate rules for tab-oriented files. Because it happens to use a few of them...

What if I want indent style to be spaces instead of tabs? Would this work?

It would have no effect on GitHub as you are already using spaces which won't be changed. I guess the intent is for an editor to change your tabs to 4 spaces when you use a tab in your editor. But it won't affect display, only tab conversion in your editor.

@ioquatix

This comment has been minimized.

Copy link

ioquatix commented Apr 9, 2017

I added a .editorconfig and while browsing code in lib/ was affected, code in README.md was not.

https://github.com/socketry/async

Any ideas how to get tab-width set correctly in README.md?

@Alhadis

This comment has been minimized.

Copy link

Alhadis commented Apr 9, 2017

@ioquatix This appears to be GitHub's fault, not yours. You should report this to their support team, and/or file an issue at github/markup, which I believe is responsible for rendering markdown into the HTML served to readers.

I've never noticed this until now, when I disabled the Chrome extension I use to fix GitHub's tab-size... :\

@ioquatix

This comment has been minimized.

Copy link

ioquatix commented Apr 9, 2017

@Alhadis I send them an email about it.

I believe that you should add some new preferences:

1/ A per-user/organisation tab-width preference which applies to all code within that user/organisation.

2/ A per-project tab-width preference, which overrides the previously mentioned one.

3/ And finally, a per-user tab-width preference which overrides 1/ above but not 2/, which applies to code the user is viewing.

4/ If an .editorconfig file exists, it overrides everything for that project.

The current state w.r.t. tabs in source code on GitHub is pretty bad, tabs with width = 8 is not ideal.

Additionally, 3/ above could have a min/max for mobile/desktop viewing, respectively - this is very nice because tab width can be 2 on a mobile browser and 4 on a desktop.

Kind regards,
Samuel

Already got a reply:

Hi Samuel,

Thank you for taking the time to write such a detailed and well-reasoned feature request. This sounds like a great idea, and while I can't make any promises, I'm definitely going to pass this idea on to the team for their consideration.

Please let us know if there's anything else we can do for you in the meantime, and have a wonderful day!

All the best,
Nick
@nickcannariato
GitHub Support

blowery added a commit to Automattic/wp-calypso that referenced this issue Jun 6, 2017

Tools: Update editorconfig to make github diffs easier to read
Github uses .editorconfig, if present, to determine how wide the tab character should be in diffs. See isaacs/github#170. Right now, it's using the default of 8, which makes diffs a pain to read.

This changes the value to 2, which should make diffs easier to read by letting more of the diff appear on screen. Arguments could be make (and will be I bet) about the correct value (4! 2! 3!) but getting off 8 would be nice.

blowery added a commit to Automattic/wp-calypso that referenced this issue Jun 6, 2017

Tools: Update editorconfig to make github diffs easier to read (#14803)
Github uses .editorconfig, if present, to determine how wide the tab character should be in diffs. See isaacs/github#170. Right now, it's using the default of 8, which makes diffs a pain to read.

This changes the value to 2, which should make diffs easier to read by letting more of the diff appear on screen. Arguments could be make (and will be I bet) about the correct value (4! 2! 3!) but getting off 8 would be nice.
@josduj

This comment has been minimized.

Copy link

josduj commented Aug 23, 2017

I don't know if that was intentional, but it seems that .editorconfig doesn't work for hidden files.

@Alhadis

This comment has been minimized.

Copy link

Alhadis commented Aug 23, 2017

What exactly are you referring to when you say "hidden files"...?

@josduj

This comment has been minimized.

Copy link

josduj commented Aug 23, 2017

@Alhadis dot-files

@ioquatix

This comment has been minimized.

Copy link

ioquatix commented Sep 5, 2017

The update I received here is that this is not currently a priority: github/markup#1045 (comment) Just FYI.

@iyerusad

This comment has been minimized.

Copy link

iyerusad commented Sep 25, 2017

@josduj I found the following would work for dotfiles:

root = true

[*]
indent_style = tab 
indent_size = 2 

[*.md]
indent_style = tab 
indent_size = 2 

[.*]
indent_style = tab 
indent_size = 2 
@HaraldNordgren

This comment has been minimized.

Copy link

HaraldNordgren commented Dec 3, 2017

I don't think the root stuff is necessary, so this should be enough for your Go repos:

[*.go]
indent_size = 4
@ClaudeDev

This comment has been minimized.

Copy link

ClaudeDev commented Dec 24, 2017

I was sure it was an implemented feature long ago!
We need to able to select tabs or spaces in the settings.
It is fairly simple, right?

@LorenzoTa

This comment has been minimized.

Copy link

LorenzoTa commented Feb 3, 2018

having the possibility to choice this among settings will be good; per repository will be optimal since some language seems to be affected by indentation.

It's very annoying pasting code and see the indentation becoming eccesive.

I think we all wait for this feature with patience.

@amalic

This comment has been minimized.

Copy link

amalic commented Feb 8, 2018

Tab width setting would be awesome for projects!

@s-h-a-d-o-w

This comment has been minimized.

Copy link

s-h-a-d-o-w commented May 13, 2018

One more workaround (a Userscript) for people who like me prefer something browser-independent that's integrated with the GitHub website: https://github.com/s-h-a-d-o-w/github-userscripts

@h-h-h-h

This comment has been minimized.

Copy link

h-h-h-h commented May 29, 2018

@Rich-Harris:

browsers render tabs as 8 spaces. Even among the minority of developers who agree that tabs > spaces, I've yet to find anyone who thinks that makes sense.

Just FYI:

Coding Style

...

  • Yosys code is using tabs for indentation. Tabs are 8 characters.

Source: https://github.com/YosysHQ/yosys/blob/master/CodingReadme#L221


@franciscolourenco:

Are there any editors which come pre-configured with tabs=8 spaces?

Yes, Windows' Notepad. :)


PS: To be clear: I'm no fan of a tab width of 8 spaces.

@drydenp

This comment has been minimized.

Copy link

drydenp commented May 29, 2018

There is actually someone who uses an indent of 8.

But they are spaces.

You will find such hideosity when you visit.....

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment