WordPress.org
Get WordPress

Make WordPress Core

Opened 7 years ago

Closed 7 years ago

#46972 closed defect (bug) (fixed)

Cards on Tools page too wide on mobile

Reported by: anischarolia Owned by: desrosj
Priority: normal Milestone: 5.2.1
Component: Administration Version: 4.2
Severity: normal Keywords: has-patch has-screenshots fixed-major
Cc: Focuses:

Description

Hello,

While reviewing I found that the card in Admin > Tools gets stick to the right side. Its because of the padding assigned to it. We can apply box-sizing: border-box; to .card. It will make the browser count its width including its padding and not excluding it resulting in solving this issue in all devices.

Attachments (4)

#46972-anischarolia.patch​ (432 bytes ) - added by anischarolia 7 years ago.
patch file for this issue
tools-issue.jpg​ (64.9 KB ) - added by anischarolia 7 years ago.
Screenshot for card issue
tools-issue-solved.jpg​ (61.0 KB ) - added by anischarolia 7 years ago.
Screenshot for solved card issue
46972.diff​ (392 bytes ) - added by mukesh27 7 years ago.
Fix css styling.

Download all attachments as: .zip

Change History (9)

@anischarolia
7 years ago

patch file for this issue

@anischarolia
7 years ago

Screenshot for card issue

@anischarolia
7 years ago

Screenshot for solved card issue

@mukesh27
7 years ago

Fix css styling.

#1 @desrosj
7 years ago

  • Component General → Administration
  • Milestone Awaiting Review → 5.2.1

I am able to reproduce this issue. Going to move this to 5.2.1 for testing.

#2 @desrosj
7 years ago

  • Summary Privacy tool card not proper in smaller device(iphone5) → Cards on Tools page too wide on mobile
  • Version trunk → 4.2

To reproduce this issue, test using iPhone 5 screen widths.

#3 @desrosj
7 years ago

  • Owner set to desrosj
  • Resolution → fixed
  • Status new → closed

In 45296:

Administration: Prevent cards on the Tools page from overflowing on small screens.

Props anischarolia, mukesh27.
Fixes #46972.

#4 @desrosj
7 years ago

  • Keywords fixed-major added; needs-testing removed
  • Resolution fixed
  • Status closed → reopened

Reopening for backport consideration.

For future reference, the vendor prefix for box-sizing is no longer required. The last versions that required it were Firefox 28 (2014), Safari 5 (2011), and Chrome 9 (2010).

#5 @desrosj
7 years ago

  • Resolution → fixed
  • Status reopened → closed

In 45303:

Administration: Prevent cards on the Tools page from overflowing on small screens.

Merges [45296] to the 5.2 branch.

Props anischarolia, mukesh27.
Fixes #46972.

Note: See TracTickets for help on using tickets.