Rounded border on Chrome buttons iOS

4

I recently updated my Macbook here and now all the buttons on my site are with the rounded border. I found it to be some CSS bug, but no, getting into my Windows computer is normal. Can anyone tell me what's going on?

    
asked by anonymous 16.11.2017 / 19:14

1 answer

5

Chrome has released a change to the browser's own default CSS.

From the version that was updated this month Version 62.0.3202.94 (Official Version) 64-bit

The border-radius attribute is by default with 4px for the following tags:

input[type="button" i], 
input[type="submit" i], 
input[type="reset" i], 
input[type="file" i]::-webkit-file-upload-button, 
button {
    border-color: rgb(216, 216, 216) rgb(209, 209, 209) rgb(186, 186, 186);
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    padding: 1px 7px 2px; 
}

The solution is to add a CSS Reset at the beginning of your CSS file as follows:

input[type="button" i], 
input[type="submit" i], 
input[type="reset" i], 
input[type="file" i]::-webkit-file-upload-button, 
button {
    border-radius: 0;
}
    
16.11.2017 / 19:19