WordPress.org
Get WordPress

Make WordPress Core

Opened 5 years ago

Closed 5 years ago

#46972 closed defect (bug) (fixed)

Cards on Tools page too wide on mobile

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

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 5 years ago.
patch file for this issue
tools-issue.jpg​ (64.9 KB) - added by anischarolia 5 years ago.
Screenshot for card issue
tools-issue-solved.jpg​ (61.0 KB) - added by anischarolia 5 years ago.
Screenshot for solved card issue
46972.diff​ (392 bytes) - added by mukesh27 5 years ago.
Fix css styling.

Download all attachments as: .zip

Change History (9)

@anischarolia
5 years ago

patch file for this issue

@anischarolia
5 years ago

Screenshot for card issue

@anischarolia
5 years ago

Screenshot for solved card issue

@mukesh27
5 years ago

Fix css styling.

#1 @desrosj
5 years ago

  • Component changed from General to Administration
  • Milestone changed from Awaiting Review to 5.2.1

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

#2 @desrosj
5 years ago

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

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

#3 @desrosj
5 years ago

  • Owner set to desrosj
  • Resolution set to fixed
  • Status changed from new to closed

In 45296:

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

Props anischarolia, mukesh27.
Fixes #46972.

#4 @desrosj
5 years ago

  • Keywords fixed-major added; needs-testing removed
  • Resolution fixed deleted
  • Status changed from closed to 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
5 years ago

  • Resolution set to fixed
  • Status changed from reopened to 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.