Skip to content

Unintended behavior with .control:last-child:not(:only-child) when other sibling tags are present #4045

Description

@FelixWeiss98

Location: node_modules/bulma/sass/form/tools.scss

There is a CSS logic issue when using the selector .control:last-child:not(:only-child). Because :last-child and :only-child are structural pseudo-classes, they evaluate all child nodes within a parent, ignoring the .control class itself.

If a .control element is the last element in a container but is preceded by a non-control element (like or ), the selector triggers unexpectedly. The .control is the last child, and it is not the only child (because of the label), so styles meant for multiple grouped controls are incorrectly applied to a single control.

Steps to reproduce:

<div class="field">
	<label class="label">Username</label>
	<div class="control">
		<!-- This single control is targeted incorrectly because the label acts as a sibling -->
		<input class="input" type="text">
	</div>
</div>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions