Can I pad the line numbers with zeros in front?


#1

I’d like to pad a zero or two on the front of the line numbers. When you go from writing on line 9 to writing on line 10, everything shifts over one space because of the extra digit. Is there a way to pad some zeros on the front of the line numbers so this shift doesn’t happen?


Is there a way to make a fixed width for the line number column?
#2

You can fix this with your css (less) file.


#3

How would you do that with just CSS?


#4

You could do that by adding something like this to your styles.less:

atom-text-editor::shadow {
  .line-number {
    &-0::before,
    &-1::before,
    &-2::before,
    &-3::before,
    &-4::before,
    &-5::before,
    &-6::before,
    &-7::before,
    &-8::before {
      content: '0';
      position: absolute;
    }
  }
}

#5

Yeah, I thought of that, but it doesn’t play nice with git-diff, which also uses .line-number:before


#6

Hmm really? What wasn’t working for you? It seems to work fine with git-diff for me:


#7

The styles applied to the .line-number-{0-9}:before from the devtools. The content: "0" gets overridden by a content: " ", and if I add a !important, well…


#8

Hmm that’s true but only if you manually enable Show Icons In Editor Gutter for git-diff - it should work fine out of the box though.


#9

Aaaah, gotcha. Thanks :smile:


#10

I wasn’t planning on adding a zero. I was just talking about making it fixed-width.


#11

Wow, what a great community. Thanks for all the input! You’re probably right, just making the line number column a fixed width may be the best way. Pardon my ignorence here, but can someone show me how to do that? I’ve never used CSS or Git for that matter…


#12

I tried out mnquintana’s solution and it did indeed pad zeros… But if you have 9 or less lines, the numbers one through 9 have the zero overplayed on top… Any idea how I can just set the width to be fixed without adding zeros to the front?