Modern CSS properties to make the website responsive.

The modern CSS property will make your website responsive and clean, so let's begin. The first properties that I use to get rid of overflow text

What it does is resize automatically according to the screen size.

Container

The second property is the same as before, but this time, we use a double div to make the layout responsive and have considered one div as a parent and a second div as a child. You can name it whatever you want.

We have added hot pink colour to see the borders

This property will follow along with the parent and not overflow stay under the parent

Clamp

The third CSS property that I mainly use to make images responsive

It contains min, max resolution and image size. Here 320 px is the minimum screen size that can go down, 100% is the image size, and 700 px is the maximum size at that much it can go up.

Grid Layout

The fourth CSS Property is generally used to create a grid layout. Yes! You are right, talking about one-line grid properties

Let me explain these properties, repeat means it will repeat the grid layout that will auto-fit according to the screen sizes, min-max is a screen size that much it can go down, and 1fr means height and width will be ideal for every individual grid card.