Fix user profile/edit SCF field table layout

[meravi]

Fixes #349

Summary

SCF fields rendered on user profile (profile.php) and edit user (user-edit.php) screens use WordPress table.form-table markup. This can cause label/input alignment and width issues compared to core profile fields.

Changes

• Add scoped CSS only on profile.php and user-edit.php
• Improve label width + vertical alignment
• Ensure inputs and Select2 use a consistent usable width
• Add responsive stacking on small screens

Tested

• WordPress 6.9.1
• Secure Custom Fields 6.8.0

Contributor

• GitHub: @meravi
• WordPress.org: ravikhadka

Screenshots

Before:

After:

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Core Committers: Use this line as a base for the props when committing in SVN:

Props ravikhadka, cbravobernal, yanmetelitsa.

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[meravi]

Hey @kraftbj, just pinging you for a review on this PR. I’d really appreciate it if you could take a look. Thanks!

[Copilot]

Pull request overview

This PR addresses layout/alignment issues for Secure Custom Fields (SCF) fields on WordPress user profile (profile.php) and edit user (user-edit.php) admin screens by injecting scoped CSS to better match core table.form-table styling.

Changes:

• Adds an admin_head hook to output scoped CSS on profile/edit-user screens.
• Introduces CSS rules to normalize label width/alignment and input/Select2 widths.
• Adds a responsive rule to stack label/input cells on small screens.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.