Skip to content

Fix vertical alignment of button fields set to half-width#26653

Merged
Nitwel merged 3 commits intodirectus:mainfrom
omkarg01:fix/#26610-vertical-alignment-of-btn
Feb 16, 2026
Merged

Fix vertical alignment of button fields set to half-width#26653
Nitwel merged 3 commits intodirectus:mainfrom
omkarg01:fix/#26610-vertical-alignment-of-btn

Conversation

@omkarg01
Copy link
Contributor

Scope

What's changed:

  • Removed align-self: baseline CSS property in form-field component
  • Fixed vertical alignment issue for half-width button fields

Potential Risks / Drawbacks

  • Minimal risk - only restores previously working CSS alignment
  • No breaking changes expected
  • Affects only visual layout, not functionality

Tested Scenarios

  • Created collection with half-width button field alongside text input field
  • Verified button aligns properly with adjacent fields in Content view
  • Tested with different field types (input, dropdown, button) in half-width layout
  • Confirmed full-width fields remain unaffected
  • Tested responsive behavior at different screen sizes

Review Notes / Questions

  • This is a minimal fix that restores previous behavior
  • The align-self: baseline was likely causing the misalignment

Checklist

  • Added or updated tests
  • [ ] Documentation PR created here or not required
  • [ ] OpenAPI package PR created here or not required

Fixes #26610

Copy link
Member

@Nitwel Nitwel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me, thanks for the fix. ❤️
I'm happy to merge this when you sign the cla.

@omkarg01
Copy link
Contributor Author

Looks good to me, thanks for the fix. ❤️ I'm happy to merge this when you sign the cla.

Done

@formfcw formfcw changed the title fix: restore vertical alignment for half-width button fields Fix vertical alignment of button fields set to half-width Feb 16, 2026
Copy link
Contributor

@formfcw formfcw left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 🎉

@formfcw formfcw mentioned this pull request Feb 16, 2026
3 tasks
@Nitwel Nitwel enabled auto-merge (squash) February 16, 2026 12:45
Copy link
Member

@AlexGaillard AlexGaillard left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🆒🫘

@Nitwel Nitwel merged commit 57563a2 into directus:main Feb 16, 2026
66 checks passed
@github-actions github-actions bot added this to the Next Release milestone Feb 16, 2026
@MarkBurvs
Copy link

Thank you! 🙏

barry86m pushed a commit to barry86m/directus-private-view-header-bar-title-thumbnail-fix that referenced this pull request Feb 16, 2026
…6653)

* fix: restore vertical alignment for half-width button fields

* signed the cla
barry86m added a commit to barry86m/directus-private-view-header-bar-title-thumbnail-fix that referenced this pull request Feb 16, 2026
barry86m added a commit to barry86m/directus-private-view-header-bar-title-thumbnail-fix that referenced this pull request Feb 16, 2026
AlexGaillard pushed a commit that referenced this pull request Feb 18, 2026
* fix: restore vertical alignment for half-width button fields

* signed the cla
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

Successfully merging this pull request may close these issues.

Vertical alignment of Button fields set to half-width has gone wonky in 11.15.1

5 participants