Skip to content
Submitted over 3 years ago

Built using grid

Danā€¢90
@gawnad
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Huddle landing page with a single introductory section
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello fellow coders,

I am trying to make as many projects as I can to apply what I'm learning. On this particular project I wanted to try the grid layout to test my knowledge and as the previous projects were accomplished with flex-box. I had to admit, the SVG background did give me some agro. I was trying to make close to a perfect replica.

Please don't hesitate to message me if you have any advice if some of the code could be perfected. I'm trying my best and want to succeed in this career.

Thank you in advance for checking out my project!!! šŸ˜ŠšŸ™‚

Community feedback

  • Chamuā€¢13,130
    @ChamuMutezvaPosted over 3 years ago
    • your images are not showing because the url you provided is not correct. There is no image folder. Change the path to the following
    .img {
  grid-area: img;
  width: 400px;
  height: 250px;
  background: url(./illustration-mockups.svg); //check this part
  background-size: cover;
  padding: 60px;
}

    and the html should be changed to <img src="./logo.svg" alt="">

    Good lucky

    Marked as helpful
    0
    Danā€¢90
    @gawnadPosted over 3 years ago

    @ChamuMutezva Cheers for noticing that. When I copy files to github they mention not using folders so took images out of folder individually and did not change my url. Appreciate the message. šŸ‘

    0

Please log in to post a comment

Log in with GitHub

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