Skip to content
OverviewSolutions
42
Comments
19
Gift Amachree
@jen67

All comments

  • Tksmith•240
    @Tksmith-guruSubmitted 8 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of the fact that I'm growing and getting better at coding, it still surprises me that I was able to complete this in just 2 days. I wouldn't really do anything differently

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

    I had issues in centering and making the barcode responsive but I figured it out I had to start from scratch and write all the styles all over again

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

    I would need help in functionally,so far I'm quite competent in html and css but I would need help with innovating JavaScript in this

    Responsive barcode

    1
    Gift Amachree•870
    @jen67Posted 8 months ago

    "Hi Tksmith-guru,

    I noticed that the link to your live preview for the QR code challenge is broken. I followed the link to your GitHub page and realized that the issue might be with the repository name. Here's the corrected link: https://tksmith-guru.github.io/QR-code-Component-/

    Best regards,"

    2
  • Gift Amachree•870
    @jen67Posted 9 months ago

    @mbongoelvis

    Hello mbongoelvis,

    I attempted to visit your website recently but encountered a 404 error indicating that the page could not be found. It might be worth checking the project link and making any necessary adjustments.

    Best regards,

    0
  • Gift Amachree•870
    @jen67Posted 10 months ago

    Hi MSHCHEBETYUK,

    Your solution is fantastic! I noticed a small issue—the entire webpage content isn't showing, likely due to the overflow-y: hidden in your CSS. Consider checking and adjusting it:

    body, html {
    overflow-y: hidden;  /consider adjusting or removing this line of code/
}

    Hope this helps improve your webpage display.

    Best regards.

    1
  • Gift Amachree•870
    @jen67Posted 10 months ago

    Hi @Muhammed61699,

    I hope this message finds you well. I noticed that your site is currently not displaying.

    0
  • Pradeep S•10
    @pradeeps033Submitted 10 months ago

    Padding is a bit confusing to me is there a way to use padding in this to make it easier? And if someone could explain how it works it would be really helpful. If I have done any mistakes or if there is any way to improve myself the suggestions are much appreciated. Thanks!

    Webpage with QR Code to Frontend Mentor

    1
    Gift Amachree•870
    @jen67Posted 10 months ago

    Hi @pradeeps033,

    Your solution to this coding challenge is beautiful. Regarding your questions about the use of padding: Paddings are spaces added inside the content of an element, while margins are spaces outside an element that control its position in relation to other elements.

    For a more in-depth understanding, you can check out this resource:

    w3schools

    Marked as helpful
    0
  • Rohan deshmukh•70
    @Rrdesh07Submitted 10 months ago

    1]I was not able to center the image without using flexbox , could anyone suggest any other idea to do it ? any suggestions are welcome .

    By using Html and css flexbox

    3
    Gift Amachree•870
    @jen67Posted 10 months ago

    Hi @Rrdesh07,

    Your code and card design are well done! To center an image without using flexbox, you can try using the text-align property on the parent container and set margin: 0 auto; for the image. This centers the image horizontally within its container. Here's an example:

    .card {
  text-align: center;
}


img {
  max-width: 100%;
  display: block;
  margin: 0 auto; /* Center the image horizontally */
}

Feel free to give it a try, and let me know if it helps!
    Marked as helpful
    2
  • Gift Amachree•870
    @jen67Posted 10 months ago

    Hi Pragathi567,

    Your solution to this challenge looks amazing! 👏 Just a quick heads-up: I noticed that your image isn't displaying. Consider adjusting your paths; if both your image and HTML file are in the same folder, try using this code:

    <img class="img" src="avatar-jessica.jpeg" alt="avatar-jessica">

    Keep up the great work! 🚀

    0
  • Gift Amachree•870
    @jen67Posted 10 months ago

    "Nice work, Omar! Your coding solution is great. Just a heads up, the image isn't displaying. Check and adjust the relative path when you get a chance. Keep it up!"

    consider using this since the html code and the images are in the same folder

     <img src="image-product-desktop.jpg">
 <img src="icon-cart.svg">
    Marked as helpful
    0
  • Gift Amachree•870
    @jen67Posted 10 months ago

    Great job raufahamed You did great in coding this card challenge. However I noticed that your card image does not look balance. To balance it consider using this code snippet.

    img{
  max-width: 100%;
  display: block:
}

    and removing the width set to the on the .img

    .img {
  border-radius: 12px;
  padding: 4px;
  width: 300px;  //consider removing this line
}

    To learn more about responsive images you can also check out this website [w3schools] (https://www.w3schools.com/howto/howto_css_image_responsive.asp)

    Keep up the fantastic work

    Marked as helpful
    0
  • Gift Amachree•870
    @jen67Posted 10 months ago

    Well done Nabin Katwal

    Your solution to this challenge is excellent. However, I have a suggestion that can help you centre your card.

    body{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    justify-content: center;
   align-items: center;
}

    well done once again

    Marked as helpful
    0
  • Gift Amachree•870
    @jen67Posted 10 months ago

    Hi Nadia,

    Kudos on the impressive website! For a subtle enhancement, try adding a custom cursor and a hover effect to your buttons. This quick addition can boost user engagement. Consider the following CSS:

    button {
  cursor: pointer;
  transition: background-color 0.3s ease;
}

button:hover {
  background-color: #yourDesiredColor;
}

    Feel free to adjust colors to match your design. Great job overall! Let me know if you need any assistance.

    0
  • Gift Amachree•870
    @jen67Posted 11 months ago

    "Olá! Eu percebi um pequeno problema com a tag de imagem. Em HTML, as barras inclinadas para frente / são usadas no caminho do arquivo. Então, tente atualizar sua tag de imagem assim:

    <img src="images/image-qr-code.png" alt="">

    Dê uma tentativa, e isso deve exibir sua imagem corretamente. Se tiver alguma dúvida ou precisar de mais ajuda, sinta-se à vontade para perguntar! Continue com o bom trabalho!"

    Marked as helpful
    0