@mekoness
Latest comments
- @MecosLB
Hey Stephanie! Well done, your solution looks amazing! ✨
⚫ Just a reminder to use the :hover pseudo-class to achieve the active state effects some components as the buttons require on this challenges. 😉
⚫ Also, don't forget to full customize the default footer provided, I can see you put your name on it but there's no url people could get in touch with. It is useful! 😜
🔵 Extra tip, use PixelPerfect extension so you can have a real comparision with the reference and your work. 🙌
Keep coding 💻
- @BrandonAOV@MecosLB
Hey Brandon! Nice job, your solution looks pretty cool! 👏
Just a reminder to use the :hover pseudo-class to achieve the active state effects some components as the buttons require on this challenges. 😉
Also, great job using display: flex; flex-direction: column;, but sometime there's no need to use it. E.g: <button> with display: block; can achieve the same positioning you were looking for with the flex-direction: column; 👌
Keep coding 💻
- @IbnuKhathir@MecosLB
Hey buddy, nice job! :D I recommend you to read carefully the style-guide.md file every time you do a challenge, that file specifies the width the reference's designs are made for. Also, you can find there the fonts (I saw in your html the font's link is invalid, check that out too) and weights you need to use and even the standard font size for that challenge. Extra tip, use PixelPerfect extension so you can have a real comparision with the reference and your work. :D
Marked as helpful - @Saroj-pradhan@MecosLB
Nice solution, the only problem i could see when reducing the viewport width is that you're using a margin-left: 40%, this causes your card not to be centered at some point. I'd like to recommend you to use margin auto on left-rigth if you wanna keep centered your card, of course there are other options like justify-content: center if you're using a display flex o something like that. :)
