Skip to content
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.

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

Chrome 62 adds a default border radius to <button> #706

Closed
morkro opened this issue Oct 18, 2017 · 16 comments
Closed

Chrome 62 adds a default border radius to <button> #706

morkro opened this issue Oct 18, 2017 · 16 comments

Comments

@morkro
Copy link

morkro commented Oct 18, 2017

Hello,

I have just updated to Chrome 62.0.3202.62 and discovered that they've added a default border radius of 4px to all <button> and input[type="button"]. Is this something normalize.css should normalize from now on?

Screenshot:
screen shot 2017-10-18 at 11 48 19

@slavanga
Copy link
Contributor

slavanga commented Oct 18, 2017

This is interesting. I noticed two things:

  1. The user agent stylesheet only changed on macOS. This makes sense because Windows generally doesn’t have round buttons.
  2. Even on macOS no border-radius is applied because of line 281.

@morkro
Copy link
Author

morkro commented Oct 18, 2017

  1. Even on macOS no border-radius is applied because of line 281.

I can't confirm. Even with -webkit-appearance: button; they still have a rounded border in Chrome.

@kostasmanionis
Copy link

@mgol
Copy link

mgol commented Oct 27, 2017

A ticket about that that got wontfixed: https://bugs.chromium.org/p/chromium/issues/detail?id=752450

IMO it'd be good for normalize to reset border-radius on buttons. Note that people may set -webkit-appearance: none in their code for a specific button and they won't know their button now looks broken in Chrome for macOS (and only there). This sounds like a kind of thing that normalize.css should handle.

@adamduncan
Copy link

PR for this issue here if it helps: #697

@tmair
Copy link

tmair commented Nov 6, 2017

The chrome team decided to revert the change: https://bugs.chromium.org/p/chromium/issues/detail?id=752450#c13

@cannikin
Copy link

cannikin commented Nov 16, 2017

So I just got upgraded to Chrome 62 and all our buttons got rounded! I'm on macOS. See the two buttons on the right here (the first three are actually forms, not buttons):

image
Here's the computed style:

image

@coreation
Copy link

Any idea on what the gap is between them deciding to revert the change and actual chrom(ium) updates?

@mgol
Copy link

mgol commented Nov 30, 2017

@coreation It'll be included in Chrome 63, tentatively scheduled for Dec 5th. See https://www.chromium.org/developers/calendar

@hay
Copy link

hay commented Dec 4, 2017

It seems the Chrome team has already (wisely IMO) decided to revert this change. Starting with Chrome 63 buttons will have no border-radius again.

@garrettw
Copy link

garrettw commented Dec 4, 2017

@hay If you had read the comments here before posting your own, you’d have realized that you’d be simply repeating what has already been mentioned.

@hay
Copy link

hay commented Dec 4, 2017

@garrettw i read the comments before posting myself, i just didn't see it. But thanks for pointing that out.

@mgol
Copy link

mgol commented Dec 7, 2017

Chrome 63 has just been released.

@danielbarillo
Copy link

I can confirm that updating Chrome from 62 to 63 fixes this issue!

@mgol
Copy link

mgol commented Dec 14, 2017

Should it be closed?

@necolas
Copy link
Owner

necolas commented Feb 8, 2018

Thanks for the info

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests