Product-view-card-component with just CSS and HTML

Hi, for responsiveness you need to learn CSS flexbox or CSS Grid. Or you can learn responsiveness in this short course that is completely free(https://courses.kevinpowell.co/conquering-responsive-layouts) For crossing text, you can use s tag like <s>$169.99</s> or you can use text-decoration: line-through in your CSS code. If you don't know about responsiveness, it will take time to learn and make things simple.😇👍

To make your page more responsive for all devices read about media queries: https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries

To style your page, good practice is to have separate file for css styling with you can import in head tag section, for example: <link rel="stylesheet" href="./papth-to-your-css-file.css">

To corss the perfume's value You shall use: text-decoration: line-through;

Hi Om Jha, how are you? Welcome to the front-end mentor community! 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;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
}

avoid using px, If your web content font sizes are set to absolute units, such as pixels, the user will not be able to re-size the text or control the font size based on their needs. if you want to keep using px for development and then format the whole code to rem, you can use this vscode extension: px to rem

The rest is great!

I hope it helps... 👍

use flexbox it will make your code simple you will not have to use margin so much. Try looking at other people's code and try to figure out what they r doing