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

QR-code-component

@Shubhanshi2002

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


ALL FEEDBACKS ARE WELCOME THANK YOU

Community feedback

@llr3v0ll

Posted

It's not such a big deal but I would recommend changing the container width to 290px and make the image smaller to about 250px, I would also make the h1 font-size to about 1.3rem and add some margin under the paragraph to make it look nicer. Here are the changes I made to your code(the bold text is the changes I made to your code):

1)img{

max-width: 250px;

}

2).container h1{

color:var(--Dark-blue);

text-align:center;

margin-bottom:1rem;

font-size: 1.3rem;

}

3)@media(min-width:500px){

.container{

width: 290px;

}

} 4).container p{

color:var(--Grayish-blue);

text-align:center;

margin-bottom: 13px; (You can change this)

}

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