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

Feature Request: Getting rid of gaps between inline list items #232

Open
seakrebel opened this issue Nov 11, 2016 · 0 comments
Open

Feature Request: Getting rid of gaps between inline list items #232

seakrebel opened this issue Nov 11, 2016 · 0 comments

Comments

@seakrebel
Copy link

seakrebel commented Nov 11, 2016

Since your CSS library is all about utilities, simplicity and more or less perfection, I'd like to suggest adding two lines to get rid of gaps (space) between inline list items.

There are many solutions but only one of them doesn't hurt your library, or its users.

floats, HTML commenting, not closing <li> tags, all of that is just disgusting.

However,

.list-reset { font-size: 0 !important }
.list-reset li { font-size: 1rem }

This is something that feels just right.
Of course it's kind of a hack like other solutions, but this one simply works and does no harm.
No floats, no weird HTML hacks.

It's just a suggestion, let me know what you think 😃

And btw, so I don't have to open a new topic, I'd like to suggest one more thing.
Sometimes it really comes handy if you have a class that makes elements full-width.
Right now we have col-12, but maybe adding one more class name to that just to make the code prettier.
My idea is .fill { width: 100% }

People who use flexbox often need such an utility, and putting col-12 to anchor inside list item looks confusing 😃

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant