Skip to content

error prop of input components extends their container width #470

Description

@birdofpreyru

When the error prop of Input / Checkbox / etc. component is used, and the component relies on its default, unbound container style (e.g. display: inline-flex), although the error message is currently wrapped on the next line under the component, the width of error message is added to the overall container width, growing it unnecessary, if there is available horizontal space around the container (in contrast of first consuming the available space under the main component elements). In the case of Input component it somewhat masked by the fact that its <input> element also grows and fills the added space, but for example in the case of checkbox it does not grow there, and it looks weird.

Not sure, though, what is the perfect HTML layout and CSS we need to achieve the better look & behavior; and it is not the highest priority now, thus the ticket, and not an immediate action.

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important. Nice to have improvements and optimizations.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions