Atualizei recentemente meu Macbook aqui e agora todos os botões do meu site estão com a borda arredondada. Achei até que fosse algum erro de CSS, mas não, entrando no meu computador Windows está normal. Alguém sabe me dizer o que está rolando?
-
Posta um exemplo MCVE, porque pode ser conflito de uma ou mais regras.– Syzoth ♦Commented 16/11/2017 às 18:20
-
Então, na verdade não, porque eu não mexi em arquivo CSS nenhum, e de uma hora para outra mudou. Como o @Karl Zillner abaixo disse é a versão. Estou acessando de um macbook meu antigo aqui e não está arredondado, já no meu macbook atual do trampo, está arredondado. Loucura.– GIACommented 16/11/2017 às 18:22
-
Sim, mas as vezes pode ser uma regra que mudou também e não o border-radius em si, claro que tudo leva a crer que a resposta esta certa, mas muitas coisas podem ter mudado também, MCVE serve pra isto, pra termos certeza do que estamos respondendo, se não ficamos baseados em hipóteses.– Syzoth ♦Commented 16/11/2017 às 18:26
-
Dando o inspect no elemento voce ve quais são os estilos padrão do navegador. Se vc pegar uma versão anterior do Chrome ele não tem o atributo border-radius– Karl ZillnerCommented 16/11/2017 às 20:26
-
@KarlZillner foi um otimo chute, mas isso pode ser um problema, presumir é bom as vezes, mas não dá pra dizer sempre que é isto, ainda mais se a pergunta não contém um MCVE (leia o link pt.stackoverflow.com/help/mcve), sua resposta deve estar certa, mas as instruções que passei era para o Guilherme, MCVE é uma boa maneira de garantir boas perguntas.– Syzoth ♦Commented 17/11/2017 às 0:34
|
Mostrar mais 4 comentários
1 Resposta
O Chrome lançou uma alteração no CSS padrão do próprio navegador.
A partir da versão que foi atualizada neste mês Versão 62.0.3202.94 (Versão oficial) 64 bits
O atributo border-radius vem por padrão com 4px para seguintes 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;
}
A solução é acrescentar um CSS Reset no começo do seu arquivo CSS da seguinte forma:
input[type="button" i],
input[type="submit" i],
input[type="reset" i],
input[type="file" i]::-webkit-file-upload-button,
button {
border-radius: 0;
}
-
Nossa. Que malucos! Isso vai afetar diversos site.. mas enfim, obrigado pela sua resposta, espero que ajude outros com o mesmo problema que eu! Obrigado.– GIACommented 16/11/2017 às 18:20
-
1Pois é...tem um monte de gente que não está sabendo disso que ta com site quebrado pra Chrome no iOS atualizado.... Commented 16/11/2017 às 18:23