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

List block: Equalise spacing between list elements #14100

Closed
sarahmonster opened this issue Feb 25, 2019 · 4 comments
Closed

List block: Equalise spacing between list elements #14100

sarahmonster opened this issue Feb 25, 2019 · 4 comments
Assignees
Labels
[Block] List Affects the List Block Needs Testing Needs further testing to be confirmed. [Type] Enhancement A suggestion for improvement.

Comments

@sarahmonster
Copy link
Member

Spacing between list elements isn't consistent throughout a nested list. It's easiest to see this when using underscores instead of text:

list-item-spacing

But I measured to be sure I wasn't seeing things:

list-item-spacing-counted

This looks to be happening because the margin between the content of an <li> and the <ul> nested inside it is defined solely by the line-height of the parent <li> element. Adding a bit of top-padding to the child <ul> will even things out, so the spacing between list items is consistent across the list.

@sarahmonster sarahmonster added [Type] Enhancement A suggestion for improvement. Needs Design Feedback Needs general design feedback. [Block] List Affects the List Block labels Feb 25, 2019
@sarahmonster sarahmonster self-assigned this Feb 25, 2019
@sarahmonster sarahmonster mentioned this issue Feb 25, 2019
13 tasks
@kjellr
Copy link
Contributor

kjellr commented Mar 5, 2019

@sarahmonster Is this still an issue? I just tested using the Gutenberg Starter Theme (which has no editor styles), and the spacing appears uniform for me:

artboard

@sarahmonster
Copy link
Member Author

Hm—in both Firefox and Safari, here's what I'm seeing with the Gutenberg Starter Theme:

Screenshot 2019-03-26 at 21 20 38

It looks like it's happening on the frontend too:

Screenshot 2019-03-26 at 21 23 02

@karmatosed karmatosed added Needs Testing Needs further testing to be confirmed. and removed Needs Design Feedback Needs general design feedback. labels Jul 16, 2019
@mapk
Copy link
Contributor

mapk commented Jul 16, 2019

I just tested in Firefox using the Gutenberg Started theme and got good results.

Editor:

Screen Shot 2019-07-16 at 10 35 21 AM

Frontend:

Screen Shot 2019-07-16 at 10 37 17 AM

@tellthemachines
Copy link
Contributor

Closing this as I can't reproduce it with the starter theme on any browser. Feel free to reopen if the problem persists!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] List Affects the List Block Needs Testing Needs further testing to be confirmed. [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

5 participants