How to stop HTML down-sizing?

You know how on google you can stop the html from getting smaller after a certain screen width? Like the google search page will only downsize so much before it just stops. Is there anyway i can do this on my html? I’m new to bootstrap.

Here is my pen --> https://codepen.io/Mike-was-here123/pen/xpEqWX

I tried @media screen and (max-width: 1080px) and (min-width: 520px) but did nothing.

If i go on google search --> inspect --> change the width of the page by dragging it, you can see it stops downsizing and trying to change the html after a certain limit.

hmm a little confused about what you mean by “html down-sizing”…

For text, you can try searching for viewport sized typography. But it also takes some cacl() to make them fail-safe, otherwise they can get way too small on mobile, way too big on desktop.

For HTML elements, you can set them with a fluid width (%, vw, etc), and a fixed min-width to keep them from going extremely small.

If i go on google search --> inspect --> change the width of the page by dragging it, you can see it stops downsizing and trying to change the html after a certain limit.

So does anyone know?

Maybe this is what you want?

body {
    min-width: 520px;
}

Yes thanks, it worked! :smiley: