Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Challenge 2

Sherif• 150

@hikkenoace1

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Welliton San• 170

@Kira-Sann

Posted

vi que você não fez o efeito de hover nos botões para fazer isso e simples você só precisa adicionar :hover no que quiser alterar olha o exemplo abaixo

inicialmente a cor do botao e preta

button {color: black;}

mas adicionando o Pseudo-elemento hover ao botão quando o mouse pasar em cima do elemento a cor dele vai mudar para vermelha

button:hover {color: red;}

também esta faltando a versão mobile para isso você pode usar a chamada media query basta usar

media screen and (max-width: (screen size for changes to start working, ex:600px)px) {

Marked as helpful

1
Sherif• 150

@hikkenoace1

Posted

why does the font of the heading doesn't look like what i made in the original code

0

Carl• 815

@CarlHumm

Posted

@hikkenoace1

  1. You have font-family: big shoulders display thin
  2. That font is not linked in the head or downloaded and imported in your stylesheet using @font-face.

The reason it looks fine locally is because you've probably downloaded that font from google as a Zip file and installed it locally. But for it to work online you need to link to it to provide a reference for computers without it downloaded.

Useful Resource

Instead of clicking on 'download family' on google fonts, you can select individual fonts and it will bring up a sidebar with pre-generated code to link in head, or import in stylesheet

Marked as helpful

1
Sherif• 150

@hikkenoace1

Posted

thank you @CarlHumm

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord