Skip to content
OverviewSolutions
5
Comments
6
internetcode999
@internetcode999

All comments

  • P
    lawless•200
    @djlaw90
    What are you most proud of, and what would you do differently next time?

    Most proud of how close it visually looks to the design. Need to figure out how to not do negative margins.

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

    Too much space between my name and city. I used a negative margin. Also applying the downloadable font.

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

    How to properly reference the downloaded font.

    Social Links card

    2
    internetcode999•80
    @internetcode999

    nice

  • internetcode999•80
    @internetcode999

    hey! thanks for the feedback, you're right, i had to change the size, but i still included the min-width so it doesnt shrink below that. it enforces the width. i also checked your code and cloned it from your repo. here are my thoughts;

    1. you shouldnt have used a div tag for the card, you should have used an aside tag to improve the html code semantically. if you still decide to use the div, add a role attribute for accessibility reasons.

    2. there was no need for a div tag in the footer, the footer already is a container for the attributions, if you still go with the div, then add a role attribute: role="contentinfo" in the div tag.

    3. also add a fallback font in your body, font-family: inter, "sans serif"; incase for some reason the inter font doesnt load.

    4. also add a height of 100dvh in your body not your main, use a 100% for the main. watch this youtube video to know why https://www.youtube.com/watch?v=O16af0iRs44&pp=ygUcdXNlIGEgMTAwZHZoIG5vdCBhIDEwMHZoIGNzcw%3D%3D

    5. also you should have kept the name and the place in a container so the gap can differ from the other elements, from the design example, the gap is smaller, so make a div flex container for the name and place. you should also do the same with the links, put the links in a ul tag and make it a flex container also.

    Marked as helpful
  • EggBacon•60
    @Kabadon
    What specific areas of your project would you like help with?

    I need help with the layout..it's not the same with Figma and how to make the CSS code cleaner

    HTML, CSS Blog card

    2
    internetcode999•80
    @internetcode999

    i made changes and sent you a pull request on github

    Marked as helpful
  • internetcode999•80
    @internetcode999

    thanks a lot. i made the changes to the code

  • ghafour•70
    @cgfhjff

    ferst

    #accessibility
    1
    internetcode999•80
    @internetcode999

    cool, your text is a bit blurry though, is it an effect?

  • ryanslabroom•220
    @ryanslabroom
    What are you most proud of, and what would you do differently next time?

    Getting GitHub CMD to work....

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

    GitHub CMD would not deploy or show my index.

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

    Getting better at making sites scale for mobile and desktop.

    Display:Flex

    1
    internetcode999•80
    @internetcode999

    use viewport units for better responsiveness. for the text, i used this code : width: clamp(150px, 18vw, 240px); so it scales with the browser and also fits well into the qr-container. i also used the code with the image so they both have the same width and look more consistent