Social Links Profile 🎯. [BEM]

Community feedback

• 

  P

  Jake Godsall•1,390

  @jakegodsallPosted 8 months ago

  Hi 👋

  Great work with this!

  I've cloned your repository and played around with the code a little. You're approach to styling the image and creating the layout is mostly just fine in my opinion.

  Just a couple of minor points:

  • The <div> around the profile picture is kind of unnecessary. Wrapping the image and then adding a border-radius to the container leads to you needing to apply overflow: hidden on the container. You could actually remove this container and just apply the border-radius directly to the <img> element. That way you don't have to worry about overflow.

  • You're having some problems with the layout of the image because you are combining both fixed-value width and height with transform: scale() to define the size of the image. width and height are part of the box-model, and therefore inform the rest of the document where elements should be placed. transform: scale() is not. That means when you increase the size with the transform: scale() function, the image becomes bigger, but the space allocated for it does not increase. I'd recommend just using width and height exclusively and then adding a margin-bottom to the image to create space below.

  Hope this helps 😁

  Marked as helpful

  1

  ---

  

  Rahul Kumar•570

  @rahulkumar215Posted 8 months ago

  Hello @jakegodsall 👋

  Thanks for the feedback, I will definitely work on this and improve my code.

  0

  

  P

  Jake Godsall•1,390

  @jakegodsallPosted 8 months ago

  @rahulkumar215 you’re welcome! Happy coding 😁

  0