Skip to content
OverviewSolutions
6
Comments
4
Mad Artist Photography
@MadArtistPhoto

All comments

  • Mad Artist Photography•100
    @MadArtistPhotoPosted 4 months ago

    Okay, I re-did the code and the A stays within the LI. Two examples. One with the width of the clickable area based on the width of the text in the link (more text, wider link area). And the other with the clickable area set to the width of the parent element (containing DIV) so all links can be the same width. -CodePen here-. I'm sure there is a cleaner and more elegant way to code this, but it works for me.

    Marked as helpful
    0
  • Mad Artist Photography•100
    @MadArtistPhotoPosted 4 months ago
    This comment was deleted 4 months ago
    0
  • Mystique(Nyo)•20
    @Mystique9901Submitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I didn't know that I can use 100% height with html tag to center the card. I guess it become a little easier than before.

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

    It took me almost an hour to finish. I think I need to practice more.

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

    I always have trouble with deciding the width and height of the card. I don't know what percentage it should be.

    And if there is any advice you want to give me, warmly welcome.

    social-link-profile-solution

    3
    Mad Artist Photography•100
    @MadArtistPhotoPosted 4 months ago

    Trying to match all the measurements can be quite a challenge. I have added two tools to my arsenal. First- a Graphics Program that will display an image at 100% (Faststone Image Viewer works). Second- PicPick, an image accessory program. PicPick has a ruler you can use on screen where you are viewing the Design Image provided with the challenge. This allows you to measure everything, the card size, spacing between elements, spaces that would be margins or padding, etc. This makes it a lot easier than trying to guess the dimensions.

    Marked as helpful
    1
  • AReactDeveloper•340
    @AReactDeveloperSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    Hello again dear community in this project i used scss preprocessing i didn't wanna use just vanilla like previous one i wanted to learn something new every challenge from this website i tried to get this as pixel perfect as possible though sometimes that gave me a headache considering its very hard to calibrate between margin and padding i know basic box model stuff but I've always struggled with that if you have any tips please leave them down below ill make sure to mark your comment as helpful comment if you care to spare time to review my code help me out with my mistakes and stuff i appreciate that a lot also thank you much for passing by

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

    trying to get pixel perfect design while calibrating width and height with margin and padding I don't think I overcame that

    almost pixel perfect social links profile using SCSS CSS on steroids'

    3
    Mad Artist Photography•100
    @MadArtistPhotoPosted 4 months ago

    I too struggle with 'pixel perfect or close enough' . What makes it more challenging is in the free versions the font size and colors in the style.md file and on the design images occasionally don't quite match. I'm working on my seventh challenge and I find myself leaning more and more towards the 'close enough' end of the scale.

    The one thing many people seem to miss in this challenge is when in the 'active state' the pointer turns to a black hand.

    Marked as helpful
    1