Profile Card

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted over 1 year ago

  Hello there 👋. Good job on completing the challenge !

  CSS 🎨:

  • Try this to set the two circles:

    body {
      background-position: right 52vw bottom 35vh, left 48vw top 52vh;
    }
    

  • To center the component in the page, you should use Flexbox or Grid layout. You can read more about centering in CSS here 📘.

    Using flexbox layout:

    body {
       min-height: 100vh;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
    }
    

    Using grid layout:

    body {
       min-height: 100vh;
       display: grid;
       place-content: center;
    }
    

    And remove this:

    .container {
        /* margin-top: 250px; */
    }
    

  CSS Reset 🔄:

  • You should use a CSS reset. A CSS reset is a set of CSS rules that are applied to a webpage in order to remove the default styling of different browsers.

    CSS resets that are widely used:

    • Reset CSS
    • "My Custom CSS Reset" by JoshWComeau

  Happy coding!

  Marked as helpful

  1

  ---

  

  Gilad Weinberger•150

  @Gilad-WeinbergerPosted over 1 year ago

  @MelvinAguilar Thank you very much!

  0