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>

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

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