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
Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

P

@flaviocmb

Posted

Suggested Modifications

  1. Fix Padding and Margin:

    • Adjust values to be sensible and remove errors.
    • Example:
      .a {
        padding: 20px;
      }
      .b {
        padding: 20px;
        margin: 20px;
      }
      
  2. Correct Font Properties:

    • Use valid font-weight values and remove unsupported properties.
    • Example:
      .b h3 {
        font-weight: 700;
      }
      .b p {
        font-weight: 400;
        font-size: 16px;
      }
      
  3. Adjust Image Dimensions:

    • Ensure consistent width and height for images.
    • Example:
      .c img {
        width: 100%;
        height: auto;
      }
      
  4. Remove Redundant CSS:

    • Remove unsupported or unnecessary properties.
    • Example:
      .b h3, .b p {
        /* Remove font-optical-sizing if not needed */
      }
      

Every tweak and adjustment is a step towards perfection - your dedication to refining your design is truly inspiring! Keep up the great work! 🌟

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