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 using html and css only

Sab 20

@Sabicana

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


What are you most proud of, and what would you do differently next time?

i really proud because this is my first project at frontend mentor.

What challenges did you encounter, and how did you overcome them?

maybe about adding some padding to h1 , i still dont know much about layout

What specific areas of your project would you like help with?

how to make a space between left and right element H1? because if i add margin/padding left and right , it makes h1 becomes 3 lines. i still want it to be just 2 lines. is this something with the width of container ? or with the flex ? thanks

Community feedback

@KapteynUniverse

Posted

It is because you set the .container width to 400px, margin and padding doing what you want but since the container can't get bigger than 400px anymore, h1 text is wrapping instead.

What you want to acquire is probably can be done with reducing the h1s text size and leaving the padding. Try this one:

h1 {
    padding: 0px 2rem;
    font-size: 1.625rem; /* or 1.75rem */
.
.
.
}

Marked as helpful

1

Sab 20

@Sabicana

Posted

oh font size! didnt think about it. thank u so much @KapteynUniverse

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