Social-links-profile using css

Community feedback

• 

  Daniel 🛸•44,270

  @danielmrz-devPosted 9 months ago

  Hello @Samarth-5109!

  Your project looks great!

  I have one suggestion for you to improve it even more:

  • Using margin is not the best option to center an element. Here's a very efficient (and better) way to place an element in the middle of the page both vertically and horizontally:

  📌 Apply this to the body (in order to work properly, don't use position or margins):

  body {
      min-height: 100vh;
      display: flex;  /* it works with grid too  */
      justify-content: center;
      align-items: center;
  }
  

  I hope it helps!

  Other than that, great job!

  Marked as helpful

  1

  ---

  

  Samarth Bhardwaj•50

  @Samarth-5109Posted 9 months ago

  thanks @danielmrz-dev, in my next challenge I have kept this in my mind to use flexbox. Will make these changes in this one too.

  1
• 

  Manoj Kumar Singh•970

  @dev-mksinghPosted 9 months ago

  Hey@Samarth-5109, okay first thing first, congrats on your completion of your site. But there are lot of fixation in your site, the major thing is its lacking responsiveness. If you resize the window screen then you will see that the elements even your links are overflowing.

  • Avoid using unnecessary padding and margins(you did because of which the buttons/links dont work, if you click anywhere except the label then the link is not working.
  • Consider using flex or gird for responsiveness

  There's nothing i'm saying to demoralize you, okay? nothing to be offended? you can improve it. Looking forward to see your improved code. Hope this is helpful Happy coding. And feel free to ask me if you need further help.

  Marked as helpful

  1

  ---

  

  Samarth Bhardwaj•50

  @Samarth-5109Posted 9 months ago

  thanks @dev-mksingh for your valuable feedback.

  • will make sure not to use unnecessary padding and margin.
  • For responsiveness I do not know where to learn from. Can you please share some resources.
  • Also, how do I get to know where to you use div, margin, padding, different units.

  0

  

  Manoj Kumar Singh•970

  @dev-mksinghPosted 9 months ago

  @Samarth-5109 Hey for the beginner resources i'll like to enlighten the following:

  • w3schools.com
  • When you will learn responsiveness you will understand how units play their roles. On the overview, you might have seen: %, vw, vh, rem, em values in place of px so you have to learn about them.
  • margin, padding, border you can think of them as two boxes containing text. How you can separate both the boxes? with space right? so here margin, padding and border comes. border put the separation line, margin distance each other by create space outside each other. and padding create space within each boxes that appears as space and thus separation.

  If you need more feel free to ask. And thanks to follow me. Hope i'm clear to you and that this is useful. Happy coding.

  Marked as helpful

  1