Resolve "Embedded snippets numbering and scrolling is off"
What does this MR do?
This MR resolves two issues with the display of embedded snippets:
- Scrolling in the snippet only applies to the code, not the line numbers (so line numbers stay the same, while the code changes). Fixed by moving
overflow-x
one level higher to the containing div - Line numbering is off in general, especially for larger snippets (see video). Fixed by setting
display: inline-block
for the code lines, as it's done already for all the other code highlighting already.
Additionally, I changed a probably erroneous min-height
to line-height
, but I noticed no visible change caused by this.
Screenshots
Before
After
Does this MR meet the acceptance criteria?
Conformity
-
Changelog entry - [-] Documentation (if required)
-
Code review guidelines -
Merge request performance guidelines -
Style guides - [-] Database guides
- [-] Separation of EE specific content
Availability and Testing
- [-] Review and add/update tests for this feature/bug. Consider all test levels. See the Test Planning Process.
-
Tested in all supported browsers - [-] Informed Infrastructure department of a default or new setting change, if applicable per definition of done
Closes #207934 (closed)