Skip to content
Submitted about 3 years ago

3-column-preview-card-component

Zinah•420
@Zinah-Zwayen
A solution to the 3-column preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hi, Please check my solution, my cards pop up when I hover on the buttons!! any advice? all feedbacks are welcome. Thanks

Code

Please log in to post a comment

Log in

Community feedback

  • Nicki•170
    @Nickil13

    Hey Zinah!

    It looks to me like your cards are popping up on hover because of your button border going from the default (1px) to 3px on hover. Something you can do is adjust the button CSS so that it's transparent 3px before the hover so the size of the button remains the same between states.

    Another thing I would suggest is using styling the generic button tag or making a class name for all buttons so you don't have to rewrite the same CSS for each button.

    ex. <button class="btn button1">Learn More</button>

    In the above example, btn could have adjustments that all the buttons have in common (border radius, border color, font-weight) and button1 can have things specific only to button 1.

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