Product Preview Card Component

Hi Dev Gobind Ganguly, how are you?

I really liked the result of your project, but I have some tips that I think you will enjoy:

• To align some content in the center of the screen, always prefer to use display: flex; it will make the layout more responsive!

Example:

body {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
}

The rest is great!

I hope it helps... 👍

Hello @devgobind. First of all, congratulations on finishing this challenge!

Here are some few suggestion I can give:

• Using <picture> tag is a better practice in this challenge where the image source change according to the screen width. See this on how to use it.
• The <h1> tag is used for the main header of the document so I suggest changing the

<div class="price btm-pad">
       <h1 class="d_price">$149.99</h1>
       <p class="o_price">$169.99</p>
</div>

to something simpler like this:

<p class="price">$149.99<span class="o_price">$169.99</span><p>

I hope it's helpful and happy coding!