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 solution using HTML & CSS

@Samuelnerat

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 am most proud of the design and how I got to achieve it with plain HTML and CSS. Next time I would like to work with other technologies to achieve the interface

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

The challenge I encountered at first was responsiveness I overcame it by researching a solution

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

I would like feedback on the code. if there is anything I should have used to make it more efficient or easier.

Community feedback

@Wuffskyarts

Posted

First, I think you did amazing on the final design's result! It looks perfect. I can relate to learning the responsiveness of a webpage; it can be quite a pain.

Looking at the responsiveness, I think you nailed it! It resizes perfectly.

A similar issue I ran into, I think there could be some minor tweaks to your <div>'s. The <div class="container"> works as the parent container. You can keep all the child elements in another div (img, h1, p) inside the parent div without separating the image and text (h1, p) with two different divs.

You can define .child img, .child p and .child" h1 in your CSS. Another suggestion is your "*" all tag; you can determine the default text style to remove the .child p tag within the CSS.

  • { font-size: 15px; font-family: "outfit," sans-serif; text-align: center; }

I think you did fantastically, and your code looks lovely! These minor tweaks can clean up your CSS for much larger projects (500+ lines) :)

I can relate to this project; it took me a while, and I'm still learning HTML, CSS and JS.

Marked as helpful

0
P
Julie 90

@salentipy

Posted

Your code looks nice to me. I'm still learning all about responsivity myself and dealing with some issues there, so I'm afraid I don't have any kind of specific feedback to offer in that regard. Semantic HTML looks good, in my opinion. Nice job!

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