Make WordPress Core

Opened 23 months ago

Last modified 22 months ago

#62601 new enhancement

The padding in the login form is not consistent; it varies.

Reported by: deeppatel8950 Owned by:
Priority: normal Milestone: Awaiting Review
Component: Login and Registration Version: 5.3
Severity: normal Keywords: has-patch
Cc: Focuses: ui, css, administration

Description

In a login form, using the same padding for the top, right, bottom, and left of the input fields ensures a better and more consistent design.

Attachments (1)

Screenshot 2024-11-28 at 6.35.20 PM.png​ (265.9 KB ) - added by deeppatel8950 23 months ago.
In a login form, using the same padding for the top, right, bottom, and left of the input fields ensures a better and more consistent design.

Download all attachments as: .zip

Change History (10)

@deeppatel8950
23 months ago

In a login form, using the same padding for the top, right, bottom, and left of the input fields ensures a better and more consistent design.

This ticket was mentioned in ​PR #7913 on ​WordPress/wordpress-develop by ​@sainathpoojary.


23 months ago
#1

  • Keywords has-patch added

This PR addresses a design inconsistency in the login form input fields. Previously, the margin was applied using shorthand syntax (margin: 0 6px 16px 0), which resulted in inconsistent spacing. The fix replaces the shorthand margin with margin-bottom: 16px to ensure a more uniform and predictable layout.

Trac ticket: #62601

#2 @deeppatel8950
23 months ago

  • Keywords has-patch removed

It's padding issue not margin issue.

#3 @sainathpoojary
23 months ago

Hey @deeppatel8950,

Thank you for pointing that out! I’ll make sure to add it to the PR.

Also, I wanted to confirm: is the 6px margin on the right the expected behavior?

#4 @deeppatel8950
23 months ago

Hi @sainathpoojary

It's a padding issue, not a margin issue. Add 3px or 5px of padding to ensure a consistent design across all sites.

#5 @yogeshbhutkar
23 months ago

  • Keywords has-patch added

#6 @abcd95
23 months ago

  • Keywords needs-design-feedback added

Hi, @deeppatel8950, thanks for reporting this!

The current padding values (3px vertical, 5px horizontal) appear to be intentional, as this is a common design pattern for form inputs. Different horizontal and vertical padding often helps create better visual balance, since text typically needs more horizontal space than vertical space to maintain readability.

However, it would be valuable to get design feedback on this.

#7 @sabernhardt
23 months ago

  • Component General → Login and Registration
  • Keywords 2nd-opinion added
  • Type defect (bug) → enhancement
  • Version 6.7.1 → 5.3

[46371] purposely changed the padding from 5px on all sides to a rem-based measurement that is slightly less on the top and bottom.

The password field also has more padding on one side to avoid overlap with the visibility toggle button.

​@sainathpoojary commented on ​PR #7913:


23 months ago
#8

Closing this PR as this is the expected behavior, as per the discussion on Trac.

#9 @deeppatel8950
22 months ago

  • Keywords needs-design-feedback 2nd-opinion removed
Note: See TracTickets for help on using tickets.