Price Grid Component

Hello @Benjamin-odekina I hope you are doing well.

-Well-structured HTML with clear content.

-Effective use of semantic elements like <h2> and <p>.

Includes essential meta tags for accessibility.

Links to an external stylesheet for styling.

Improvement suggestions:

-Add alt text to the favicon image.

-Ensure all elements have proper closing tags.

Hello @Benjamin-odekina!

Your project looks great!

• 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!

Hi, you did a great job on your challenge, one thing I can suggest is to center your design horizontally on the screen, you can do achieve this by adding this code to your body element:

    min-height: 100vh;
    display: flex;

what this code does is make the body height identical to the screen height which gives you this desired effect.

I hope you find this feedback helpful.