Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Botão não aplica configuração de borda e perde efeito

Segue imagem de como está o botão sem ter a borda configurada: Imagem de dois botões com os escritos "Criptografar" e "Descriptografar", ambos possuem borda preta

Quando adiciono o código que quero no CSS ele fica assim:

border: 5px solid pink;

Imagem de dois botões com os escritos "Criptografar" e "Descriptografar", ambos possuem borda rosa sem sombreado

PORÉM já não fica mais com o efeito "clicável" que os botões precisam ter.

E quando aplico no CSS dessa outra forma ele fica assim:

border-color: pink; border-width: 5px;

Imagem de dois botões com os escritos "Criptografar" e "Descriptografar", ambos possuem borda rosa claro com sombreado rosa escuro

Com o efeito "clicável" PORÉM com esse sombreamento no rosa.

Entendi parcialmente que há algo de errado com a propriedade border-style, mas não compreendo como corrigir. O objetivo é deixar a borda toda rosa, sem sombreamentos e com o clique correto.

2 respostas
solução!

Olá Barbara! Tudo bem contigo?

A princípio, eu não entendi o que exatamente é esse efeito "clicável", isso dado que o projeto desse curso não tem esses botões. Então se você pudesse compartilhar o código HTML e CSS para que eu pudesse testar daqui e explicasse com detalhes o que seria esse efeito clicável que você quer, eu conseguiria ajudar melhor.

Agora sobre o problema com a borda, na verdade, o que acontece, baseado nas imagens e em seu relato, é que o botão na primeira imagem foi configurado com uma borda no estilo solid que deixa a borda estável e uniforme, mas na segunda imagem ela recebeu inset como configuração, o que deu aquele efeito, para você entender sobre a diferença entre elas eu deixo aqui a documentação da propriedade border-style:

Era isso!

Aguardo sua resposta para que eu possa te auxiliar da melhor forma possível! Abraços e bons estudos.

Ahh, muito bom! Acho que era questão de estilizar mesmo o botão. Senti falta do efeito de "click" nele com a borda sólida justamente por não ter um efeito que sinalizasse a ativação dele. Obrigada.