Skip to content
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

Ordered and suffix list styles bug after 9. #1130

Open
jjylha opened this issue Oct 29, 2019 · 5 comments · May be fixed by #2142
Open

Ordered and suffix list styles bug after 9. #1130

jjylha opened this issue Oct 29, 2019 · 5 comments · May be fixed by #2142
Labels
lang/css Anything involving CSS state/has-pr An issue which has a related PR open type/bug Any issue which is a bug or PR which fixes a bug
Milestone

Comments

@jjylha
Copy link

jjylha commented Oct 29, 2019

Bug Report

When ordered list (with added dots from list.variables) or suffix list has numbers over 9. the styling fails.

Steps to reproduce

https://jsfiddle.net/qgms8p07/

Expected result

Numbers have the same margin relative to text no matter how big the number is.

Actual result

When list number is bigger than 9. the number/dot will have no margin relative to text and will even overlap.

Testcase

https://jsfiddle.net/qgms8p07/

Screenshot

list

Version

2.7.8

@lubber-de lubber-de added type/bug Any issue which is a bug or PR which fixes a bug lang/css Anything involving CSS labels Oct 29, 2019
@exoego
Copy link
Contributor

exoego commented Oct 29, 2019

I will look into this.

@exoego exoego self-assigned this Oct 29, 2019
@exoego
Copy link
Contributor

exoego commented Oct 29, 2019

This is similar to Semantic-Org/Semantic-UI#2332

@exoego
Copy link
Contributor

exoego commented Oct 29, 2019

I resigned myself from this issue since I am not familiar with counter-things in CSS. (I will try to create a PR, but may take a long time).
I wonder this is fixable without breaking change 🤔

@exoego exoego removed their assignment Oct 29, 2019
@byte916
Copy link
Contributor

byte916 commented Mar 30, 2020

I have the same problem and want to fix it.

I see three ways

  1. Using javascript
  2. Adding new selectors, for example - .tens, .hundreds, .thousands etc
  3. Adding ability to return to native numbering

@lubber-de lubber-de added the Hacktoberfest Issues for Hacktoberfest! label Sep 22, 2020
@lubber-de lubber-de added the state/has-pr An issue which has a related PR open label Oct 23, 2021
@lubber-de lubber-de added this to the 2.9.0 milestone Oct 23, 2021
@lubber-de lubber-de removed the Hacktoberfest Issues for Hacktoberfest! label Dec 16, 2021
@lubber-de lubber-de modified the milestones: 2.9.0, 2.9.x Apr 7, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
lang/css Anything involving CSS state/has-pr An issue which has a related PR open type/bug Any issue which is a bug or PR which fixes a bug
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants