Extra horizontal space when line number 10 is created #85

Closed
opened 2019-03-13 22:18:42 +01:00 by curran · 4 comments
curran commented 2019-03-13 22:18:42 +01:00 (Migrated from github.com)

Peek 2019-03-14 02-41

Observed behavior: In the included demo, when introducing line number 10 (e.g. by entering newlines), an unnecessary horizontal scrollbar appears.

At first glance, it seems that the min-width of the .codemirror-content div is causing this problem.

One solution might be to update the min-width of the .codemirror-content div when line numbers that change the gutter width (10, 100, 1000 etc.) are created or destroyed?

![Peek 2019-03-14 02-41](https://user-images.githubusercontent.com/68416/54314949-f8d37f80-4602-11e9-99b8-daa1057ef5b1.gif) Observed behavior: In the included demo, when introducing line number 10 (e.g. by entering newlines), an unnecessary horizontal scrollbar appears. At first glance, it seems that the `min-width` of the `.codemirror-content` div is causing this problem. One solution might be to update the `min-width` of the `.codemirror-content` div when line numbers that change the gutter width (10, 100, 1000 etc.) are created or destroyed?
marijnh commented 2019-03-14 09:18:25 +01:00 (Migrated from github.com)

Which browser are you on? Chrome and Firefox Linux seem fine.

One solution might be to update the min-width of the .codemirror-content div when line numbers that change the gutter width (10, 100, 1000 etc.) are created or destroyed?

That's already done (though by creating an invisible element, since that makes it easier to get the right width).

Which browser are you on? Chrome and Firefox Linux seem fine. > One solution might be to update the min-width of the .codemirror-content div when line numbers that change the gutter width (10, 100, 1000 etc.) are created or destroyed? That's already done (though by creating an invisible element, since that makes it easier to get the right width).
curran commented 2019-03-14 14:56:51 +01:00 (Migrated from github.com)

I'm on Chrome (70.0.3538.77) in Ubuntu Linux.

Just verified the behavior again from a fresh clone and build. It's still there.

I can observe the same behavior in Firefox (65.0.1) as well:

Peek 2019-03-14 19-24

I'm curious, which flavor of Linux are you testing on? I wonder if it may have to do with the default monospace system font.

I'm on Chrome (70.0.3538.77) in Ubuntu Linux. Just verified the behavior again from a fresh clone and build. It's still there. I can observe the same behavior in Firefox (65.0.1) as well: ![Peek 2019-03-14 19-24](https://user-images.githubusercontent.com/68416/54362475-ff0f3d80-468e-11e9-829e-55ab44c5cf50.gif) I'm curious, which flavor of Linux are you testing on? I wonder if it may have to do with the default monospace system font.
marijnh commented 2019-03-14 15:00:31 +01:00 (Migrated from github.com)

Ah, I'm seeing it now—yes, that was caused by a recent change. Will look into it soon.

Ah, I'm seeing it now—yes, that was caused by a recent change. Will look into it soon.
curran commented 2019-03-15 10:18:49 +01:00 (Migrated from github.com)

Hooray!

Hooray!
Sign in to join this conversation.
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
codemirror/dev#85
No description provided.