Skip to content
Submitted over 1 year ago

3 Column Preview Card Component - Vanilla HTML/CSS

Craig•190
@cchivers
A solution to the 3-column preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

I need some help with the responsiveness of this site. Desktop was not that bad, but dealing with the mobile version I am cutting off the first element a little and if I resize the page then I can cut off more. How can I bring the element down? I don't know if this is cause of my code and I am doing this or if I should be setting something. Any help will be appreciative.

Code

Please log in to post a comment

Log in

Community feedback

  • Yusuf K. Muhammad•570
    @kyusufm

    Hi Craig,

    Nice Solution. The font's not loading though. You can add padding for the button to make it more appealing. and also add more to the margin-top.

    For the semantic html: You need to add <h1> first. don't start with h2, it's not good practice and will make seo score lower. if the h1 size too big, you can set the font-size in your css.

    That's all for now. keep going man!

  • at33v•40
    @at33v

    Hello, try doing the following:

    1. Replace height: 100vh with min-height: 100vh on the body element.

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