Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Fix Android Chrome input date dimensions #36143

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
merged 8 commits into from
Jan 18, 2023
Merged

Fix Android Chrome input date dimensions #36143

merged 8 commits into from
Jan 18, 2023

Conversation

tkrotoff
Copy link
Contributor

@tkrotoff tkrotoff commented Apr 10, 2022 •
edited
Loading

Under Android Chrome, input date dimensions are broken:

  • too tall because of "margin: 1px 24px 1px 4px" inside the shadow DOM
  • width is too small by default

Before 40px high vs 38px for the other inputs:

before

After 38px high:

after

I've tested by plugging in my Android device via USB then opened chrome://inspect/#devices (USB debugging must be enabled on the device).
Hence the need for an HTTP server

@tkrotoff tkrotoff requested a review from a team as a code owner April 10, 2022 21:48
tkrotoff
tkrotoff commented Apr 10, 2022
View reviewed changes
tkrotoff
tkrotoff commented Apr 10, 2022
View reviewed changes
@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch from 6c8aee4 to 4968592 Compare April 10, 2022 22:10
@mdo mdo requested a review from XhmikosR April 11, 2022 22:30
XhmikosR
XhmikosR previously requested changes Apr 12, 2022
View reviewed changes
Copy link
Member

@XhmikosR XhmikosR left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See comments

@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch 5 times, most recently from 234d3d0 to 73c81ec Compare April 17, 2022 21:41
@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch from 73c81ec to 83fdff0 Compare May 8, 2022 18:52
@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch from 83fdff0 to 1fefec6 Compare June 14, 2022 20:33
@tkrotoff
Copy link
Contributor Author

Any news?

@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch from 1fefec6 to 1b36335 Compare June 17, 2022 10:19
@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch from 1b36335 to ae7bcfe Compare July 23, 2022 13:50
@tkrotoff
Copy link
Contributor Author

Any news?

@mdo
Copy link
Member

mdo commented Dec 29, 2022

Missed this myself. Is the width bug present in any other browser? I don’t have an Android to test myself.

@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch from ae7bcfe to 8ecff17 Compare January 16, 2023 22:50
@tkrotoff
Copy link
Contributor Author

tkrotoff commented Jan 17, 2023 •
edited
Loading

Visual tests js/tests/visual/input.html

On macOS Monterey 12.6.2:

  • Chrome 109: no problem
  • Firefox 108: no problem
  • Safari 16.2: no problem
  • Edge 109: no problem

On Android 13 (Pixel 4):

  • Chrome 109: width & height problem
  • Firefox 109: no problem

On iOS 16.2 (iPhone 14 Pro Max Simulator):

iOS 16.2 Safari 16.2

The width problem on Safari iOS is also fixed by this PR:

iOS 16.2 Safari 16.2 fix min-width: 10ch

@tkrotoff tkrotoff force-pushed the fix-android-chrome-input-date branch 2 times, most recently from c44d271 to d8e4c4f Compare January 17, 2023 01:09
@AmimerNabil AmimerNabil mentioned this pull request Aug 18, 2024
Merged
@soelshaikh soelshaikh mentioned this pull request Aug 18, 2024
Open
This was referenced Aug 26, 2024
Open
Open
Open
@tchellam tchellam mentioned this pull request Aug 27, 2024
Open
@sophakphol sophakphol mentioned this pull request Aug 29, 2024
Open
@martinez-ml martinez-ml mentioned this pull request Aug 30, 2024
Merged
@ungtsuhan ungtsuhan mentioned this pull request Aug 30, 2024
Open
This was referenced Sep 3, 2024
Open
Open
Open
@thanhdt24 thanhdt24 mentioned this pull request Sep 7, 2024
Open
@AlexanderSCK AlexanderSCK mentioned this pull request Sep 8, 2024
Open
@AndresElacion AndresElacion mentioned this pull request Sep 24, 2024
Open
@castle2668 castle2668 mentioned this pull request Sep 24, 2024
Merged
This was referenced Sep 25, 2024
Open
Open
Open
@pinco227 pinco227 mentioned this pull request Sep 27, 2024
Open
This was referenced Sep 28, 2024
Open
Open
Open
Open
@Akhamesra Akhamesra mentioned this pull request Oct 2, 2024
Open
@YnnusAsamal YnnusAsamal mentioned this pull request Oct 3, 2024
Open
@jtprogru jtprogru mentioned this pull request Oct 5, 2024
Open
@Gutts-n Gutts-n mentioned this pull request Oct 5, 2024
Open
@Kimahari Kimahari mentioned this pull request Oct 5, 2024
Merged
@Arrhenius09 Arrhenius09 mentioned this pull request Nov 6, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@XhmikosR XhmikosR XhmikosR left review comments

@mdo mdo mdo approved these changes

Assignees
No one assigned
Labels
css v5
Projects
No open projects
v5.3.0-alpha2
Status: Done
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@tkrotoff @mdo @XhmikosR