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

All comments

  • Will 210

    @wkan17012021

    Submitted

    Hi, I have been practicing html/css/js since early 2021. Recently though, i have been adding to my skills by learning backend tech. So, i was surprised how long this challenge took me (on and off for about 3 hours). I guess it shows if you don't practice you get rusty. If anyone has any feedback on tips or tricks to help with responsive design- ideally i would like the qr card to gradually reduce in size as opposed to snapping to a particular size which can create a jarring effect as the screen-size is achieved set by the media query. I suppose you could set multiple media query ranges- this is the only way i am aware of. Any suggestions welcome. Thanks

    @MatzeW95

    Posted

    Hi I personally would try to set as less stuff as possible in your "main". After that you can use the section for just like a structure thing.(personally wouldn't set to much stuff in there as well) But inside the the "section" I would put a "div" that i would style. (This makes it easier to change stuff for your responsibility, because you have to only change it at one place) That "div" would only need something like "border-radius, background-color, width, margin: 5rem auto"

    It's kinda hard to tell you that stuff in text if you want you can have a look at my solution: https://www.frontendmentor.io/challenges/qr-code-component-iux_sIO_H/hub/qr-code-component-cHniroyj2

    0
  • Isabelle 30

    @isabellegeof

    Submitted

    Hey! I was curious if any of you used Bootstrap for this challenge? That's what I tried doing at first but had such a hard time! Do you find that CSS grid is better for this type of layout? Happy coding!

    @MatzeW95

    Posted

    To be honest i dont know to much about bootstrap, but grid was kinda the way to go for this challenge😅 Btw your result looks very good 👍🏼

    0
  • @MUGK1

    Submitted

    By seeing my code how can I improve in your opinion?

    What are the most mistakes that I am making in my code? so I do not make it in the future.

    In general, give me a piece of advice that can help me.

    Thank you :)

    @MatzeW95

    Posted

    Hi On mobile it would be nice to have a small margin on the sides (left and right). Maybe go for like 90% width on your main container and use "margin: auto" to center it.

    Marked as helpful

    1
  • @MatzeW95

    Posted

    you could add a box-shadow for your "main" container.

    0
  • @MatzeW95

    Posted

    I have a small thing you could change. Since the whole text align is center in your qr-card class, you can define "text-align: center" in .qr-card . So you can delete it in your "p" and "h2".

    I hope it helps you 👍🏼

    Marked as helpful

    0
  • Sagi 10

    @SagiMaimoni

    Submitted

    Hey. This is my first project. I would like to hear from you any comments - about the length, the language, and anything else.

    1. How do i make the bottom link to be under the card? when im watching my site it's perfect, but the screenshot showing another picture.

    2. there is Translator add-on on my chrome, which making my content looks wrong, and the challnge fixed only when I disabled the add-on. Is there any solution?

    Im hungry to learn, so thank u!

    @MatzeW95

    Posted

    To the first point. You have to place the whole "​<​div​ ​class​="​link​"​>"(Line 50-52) behind the "div" in line 54, But before the </body> in line 55.

    Sry but i cant help you with your second problem.

    0
  • @MatzeW95

    Posted

    If you make the 3 columns a bit thinner, you should get pretty close to the original. 👍🏼

    0
  • @MatzeW95

    Posted

    In my opinion its easier to use 3 flex column and just vertical center the first and third column.

    Marked as helpful

    0
  • Cody 170

    @Cod-Bigg

    Submitted

    I know this is not completed, but I asked questions about this on a few forums and have not heard back yet. I will update solution when I get it completed.

    1. What is the custom button? Is that an input?

    2. I could not get the white background behind both sections. I tried adding another div that included both of the sections, but it caused issues

    3. the red text on the active state section. Is that made by creating an element? I know you would have to check the input value and if it is zero would I create a span or something?

    @MatzeW95

    Posted

    To your first point. The custom "button" Is not a button. It is an input field for a custom value.

    Marked as helpful

    0