Skip to content
OverviewSolutions
2
Comments
2
IAMSSROBINSON
@IAMSSROBINSON

All comments

  • P
    Niels Bruinsma•120
    @bruins001
    What challenges did you encounter, and how did you overcome them?

    After completing the QR code component card this wasn't a difficult challenge because it was almost the same.

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

    In css I used a margin-top and margin-bottom on my h2. If I remove those margins the author image gets crushed and I don't know why.

    /* Author name */
h2 {
    color: var(--color-gray-950);

    font-family: 'Figtree', sans-serif;
    font-size: var(--font-size-3);
    font-weight: 800; /* Extra bold/Ultra bold */
    line-height: 150%;

    /* Image gets crushed else IDK why */
    margin-top: auto;
    margin-bottom: auto;

    margin-left: 0.5rem;
}

    Blog preview card with flexbox

    1
    IAMSSROBINSON•40
    @IAMSSROBINSON

    Hi there,

    Great work on your submission, your solution is looking pretty clean!

    I love your inclusion of CSS variables in your stylesheet, did you consider using variables for more of the property values that you have used more than once?

    I am encouraged by your confidence when you say 'You didn't find the challenge difficult because your solution is almost the same'! What improvements might you make so that your final result is exactly the same?

    Amazing effort - keep up the fantastic work!

  • IAMSSROBINSON•40
    @IAMSSROBINSON

    Great work on your submission!

    Your solution looks almost the spitting image of the original design.

    If the website were real the objective would be highly reliant on the qr code image. Have you considered what might occur if for some reason the image could not be rendered on the screen?

    For better accessibility purposes it would be nice to inform the user what the broken image should have represented. For this reason it could be a good idea to include some descriptive alt text inside your <img alt=""> tag since it is also picked up by assistive technology.

    Keep up the great work - that's one clean looking solution!

    Marked as helpful