3 ms·
I've often wondered this. I find columnar alignment of key:value pairs (in CSS, dictionaries, etc) to be much easier to read, but I find that I'm an outlier be
by bsimpson 11y ago
I've often wondered this. I find columnar alignment of key:value pairs (in CSS, dictionaries, etc) to be much easier to read, but I find that I'm an outlier because most people get upset when they see whitespace changes in a diff. (FWIW, `?w=0` will hide whitespace changes on GitHub).
It would be rad if an editor like Sublime or Atom understood columns and displayed code that way without needing to reindent everything in the file every time you add a longer key.
- 1wd 11y agoIt's called elastic tabstops. [1] The page links some editors that implement this and some plugins for other editors. Apparently SublimeText's plugin is incorrect though. It does not mention Atom, but it was discussed in [2]. [1] http://nickgravgaard.com/elastic-tabstops/ http://nickgravgaard.com/elastic-tabstops/ [2] https://discuss.atom.io/t/elastic-tabstops/16/23 https://discuss.atom.io/t/elastic-tabstops/16/23
- Macha 11y agoI find it more readable up until the difference in key lengths becomes larger (font and text-decoration for example), at which point I have trouble matching the values with the shorter names.
- oneeyedpigeon 11y agoJust right-align your property names. I know that sounds ridiculous, but give it a go: body { font-size: 16px; margin-bottom: 100px; padding-top: 40px; color: rgb(100, 100, 100); background-color: rgb( 90, 255, 3); }
- Already__Taken 11y agoOh way better yes. I sometimes like to indent dependent properties too: body { width: 400px; margin: 20px; position: absolute; bottom: 0; right: 0; background: #ccc; }