Admin reskin: Remove line-height from input elements

[wildworks]

The line-height of the input element has a value of 2.71428571 applied to it, making it equal to a height of 40px. This value also seems to affect the height of the background highlight when text is selected. At least, this behavior can be confirmed on Windows OS and Chrome browsers.

I don't know why this line-height value exists, but it's strange to have a highlight background that extends to the full height of the form.

[wildworks]

The background when text in an input element is selected. Comparison of the current style and my proposed style.

[audrasjb]

Adding good-first-bug keyword as this issue would be a nice bug to fix for new contributors who never submitted any Core patch yet.

[wildworks]

@fabiankaegy @joedolson Is there any reason why a line-height value equal to min-height is being applied to form elements? Would simply removing the line-height cause any problems?

Remove line-height property from URL and week input styles.

Trac ticket: https://core.trac.wordpress.org/ticket/64763

## Use of AI Tools

Could you please add the ticket URL to the PR description?

Thanks! I’ve added the ticket URL to the PR description.

[manhar]

Tested the patch on trunk.

Removing the line-height keeps the 40px height via min-height and improves text alignment/selection. No visual regressions found in admin screen.

Before Patch:
​https://postimg.cc/FYXV0Hb0

After Patch:
​https://postimg.cc/yJQRp19N

Thanks for the PR!

It applies nicely to standard inputs:

However it doesn't apply to input fields using "compact" styles:

[ozgursar]

Patch Testing Report

Patch Tested: ​https://github.com/WordPress/wordpress-develop/pull/11099

Environment

• WordPress: 7.0-beta2-61752-src
• PHP: 8.2.29
• Server: nginx/1.29.4
• Database: mysqli (Server: 8.4.7 / Client: mysqlnd 8.2.29)
• Browser: Chrome 145.0.0.0
• OS: macOS
• Theme: Twenty Twenty-Five 1.4
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.1

Steps taken

1. Check an input field in Settings > General
2. ✅ Patch is solving the problem

Expected result

• Line height is removed from input elements

Screenshots/Screencast with results

Before

After

## Description
Removes the line-height: 2.71428571 declaration from standard admin input elements. Height remains 40px via min-height; only the line-height is removed.

## Changes

• File: src/wp-admin/css/forms.css
• Removed one line-height line from the rule that targets input[type="datetime"] through input[type="week"] (and related types).

## Testing

• Checked inputs on Settings → General and other admin forms.
• Confirmed input height unchanged (40px) and selection highlight no longer fills the full field.

Trac: https://core.trac.wordpress.org/ticket/64763

Fixes #64763

Thanks for the PR.
I noticed there is already an older PR (#11099) for the same issue and it has been reviewed by a committer. Maybe it would be better to continue contributing there instead of opening a new PR.

@huzaifaalmesbah Thanks for review. okay noted

[noruzzaman]

Test Report

Patch tested: ​https://github.com/WordPress/wordpress-develop/pull/11099

Environment

• WordPress: 7.0-beta2-61809
• PHP: 8.3.30
• Server: PHP.wasm
• Database: WP_SQLite_Driver (Server: 8.0.38 / Client: 3.51.0)
• Browser: Chrome 145.0.0.0
• OS: macOS
• Theme: Twenty Fourteen 4.4
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.1

Actual Results

1. ✅ Issue resolved with patch.

Before	After

I’m closing this PR to focus on ​https://github.com/WordPress/wordpress-develop/pull/11099.

[wildworks]

Thankyou everyone for working on this ticket.

However it doesn't apply to input fields using "compact" styles:

As mentioned here, there's probably more than one thing that needs to be fixed. Let's try to investigate as much as possible where this problem is occurring.

This change removes the redundant line-height property from text-based admin input elements in src/wp-admin/css/forms.css.

The height of these elements is already sufficiently handled by the min-height property (40px for standard inputs and 32px for compact inputs), making an explicit line-height unnecessary and potentially problematic for certain font-rendering scenarios.

With regards to the previous patches in this ticket, this PR also removes the line height in the reported search bar as seen below:

Before:

After:

Trac ticket: [](https://core.trac.wordpress.org/ticket/64763)

## Use of AI Tools

[r1k0]

Patch Testing Report

Patch Tested: ​https://github.com/WordPress/wordpress-develop/pull/11246

Environment

• WordPress: 7.0-beta5-61991-src
• PHP: 8.3.30
• Server: nginx/1.29.5
• Database: mysqli (Server: 8.4.8 / Client: mysqlnd 8.3.30)
• Browser: Chrome 146.0.0.0
• OS: Windows 10/11
• Theme: Twenty Twenty-Five 1.4
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.1

Steps taken

1. Head over to Pages > All pages.
2. Enter text into the search input field, then highlight the text.
3. Observe the height of the highlight.
4. ❌ Patch is not entirely solving the problem.

5. Bonus: Check the height of the highlight background for the input fields, which I have listed in the additional notes section. Also, feel free to check other input fields around the admin dashboard.

Expected result

• The highlight background should have a shorter height meant to fit the highlighted text.

Additional Notes

• While the patch fixes the highlight height of the search input field in the Pages page and multiple other places. It still doesn't fix the highlight height for several other input fields.

As mentioned here, there's probably more than one thing that needs to be fixed. Let's try to investigate as much as possible where this problem is occurring.

• As noted above, multiple input fields need to be fixed. Thus, updating keywords to let @arkaprabhachowdhury make the necessary changes.

• When you remove the line-height for the Custom time & date format input field, the input field changes its height slightly. This makes the border top & bottom too close to the text. I suggest changing the min-height value to min-height: 26px;.

• Find screenshots of some of the other input fields that need to be fixed in the Support Content section.

• These input fields need to be fixed as well:

Page	Input-Fields
Add Plugin	Search Plugins
Add Theme	Search Themes
Comment(Quick Edit)	Name
	Email
	URL
All Pages(Quick Edit)	Title
	Slug
	Order
	Password
All Posts(Quick Edit)	Title
	Slug
	Password
Tags & Categories(Quick Edit)	Name
	Slug
Media Library	Search Media
Dashboard (Events widget)	City search
Settings > General	Time/Date Format (custom)

Screenshots/Screencast with results

Page search before:

Page search after:

Support Content

• Here are supporting screenshots that show input fields that also need to be fixed.

Media search input field:

Page quick edit title input field:

The issue still persists in the Comments screen, on quick edit fields.

Let's close this PR in favor of #11246.

@Risad212 Thanks for your efforts!

Hi @ArkaPrabhaChowdhury! Thanks for working on this issue.
As per ​this comment it seems the PR is still not solving the issue.
Do you think you'll be able to address this before WP 7.0 final release (​in a few weeks)?

Hey @juanmaguitar

I am trying my best to look into all the inputs fields and checking their line height which is taking some time.

Will try my best to address the issues and raise the fixes before the WP 7.0 final release.

Thanks!

[manhar]

line-height should be removed from standard form controls, but .wp-core-ui .tablenav inputs should be excluded from this change. These controls likely need a separate approach to maintain proper alignment without relying on line-height.

[sachinrajcp123]

Patch for #64763 - Removes unnecessary line-height from standard input elements - Adds minor adjustments to improve alignment in some inputs This builds upon previous patches. Patch ready for review.

[audrasjb]

@sachinrajcp123 thanks for the patch, however it doesn't apply against trunk. Could you please send a new one that is not build upon other PRs but against trunk? And a Github PR would be better, too. Thank you :)

Trac ticket: https://core.trac.wordpress.org/ticket/64763

## Use of AI Tools

<!--
You are free to use artificial intelligence (AI) tooling to contribute, but you must disclose what tooling you are using and to what extent a pull request has been authored by AI. It is your responsibility to review and take responsibility for what AI generates. See the WordPress AI Guidelines: <​https://make.wordpress.org/ai/handbook/ai-guidelines/>.

Example disclosure:

AI assistance: Yes
Tool(s): Claude

@ArkaPrabhaChowdhury Thanks for the PR! Let me close this PR in favor of #11383.

[wildworks]

I submitted a new ​https://github.com/WordPress/wordpress-develop/pull/11383 to address all input elements.

Thanks for the PR! I spotted two more occurrences.

General settings:

Colorpicker:

Otherwise the rest looks good to me!

Nice catch!

Colorpicker:

Addressed in ea7f3d0c14b7b82b37df158e8c1186f4438bbab0

General settings:

Addressed in 935dd5ee9dc5719f1da048a158790829f6a2ad8b

Simply removing the line-height changes the input field's height from 26px to 24px. This value is considered small in our design system, but the field feels too tiny:

Therefore, I removed the line-height and increased the height from 26px to 32px. What do you think?

Looking great to me, thanks!

[wildworks]

In 62171:

Admin reskin: Remove line-height from input fields.

line-height values that were previously used to match the height of input fields affect the height of the background shown when text inside those fields is selected. Removing these line-height declarations allows the text selection highlight to render more naturally.

Additionally, update the height of the custom Date/Time format input fields on the General Settings screen to 32px to align with the new design system.

Props arkaprabhachowdhury, audrasjb, hmrisad, huzaifaalmesbah, manhar, manishxdp, noruzzaman, ozgursar, r1k0, sachinrajcp123, wildworks.

Fixes #64763.

[wildworks]

Reopening #64763 to request backporting [62171] to 7.0 branch

[audrasjb]

Here's a second committer sign off for backport to branch 7.0.
Thanks!

[audrasjb]

Reopening for backport to 7.0.

[audrasjb]

In 62172:

Admin reskin: Remove line-height from input fields.

line-height values that were previously used to match the height of input fields affect the height of the background shown when text inside those fields is selected. Removing these line-height declarations allows the text selection highlight to render more naturally.

Additionally, update the height of the custom Date/Time format input fields on the General Settings screen to 32px to align with the new design system.

Reviewed by wildworks, audrasjb.
Merges [62171] to the 7.0 branch.

Props arkaprabhachowdhury, audrasjb, hmrisad, huzaifaalmesbah, manhar, manishxdp, noruzzaman, ozgursar, r1k0, sachinrajcp123, wildworks.
Fixes #64763.