picocss / pico

Minimal CSS Framework for semantic HTML

Home Page:https://picocss.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Inconsistent width with role=group

mwargan opened this issue · comments

Describe the issue

It's inconsistent to have a button group be 100% width when the buttons individually are not so.

Current Behavior

Buttons grow to collectively fill 100% width.

Expected Behavior

Buttons use only size they need, much like individual buttons.

If we remove width: 100%; from the [role=group], [role=search] selectors, we can get rid of this problem. Its also inconsistent that this rule sets width: 100% but using inline-flex - if we want 100% width its usually a sign of a need for block-behaviour, in which case using inline flex over just flex wouldn't make sense.

Note that the above is a "pseudo-suggestion", it would need a bit more tweaks as it screws up the search and button group.