Why does vue change its height value in chrome?

Question

Vue.js

When crossing the layout, which is done well + - normally, with the code on vue.js 3, the problem arises that in the first section, where min-height: 100vh is used, for some reason it becomes very high, and this is observed only in the chrome browser, in the rest that something else is going. Moreover, when vue.js is disabled, nothing moves and everything falls into place. In principle, the whole page is somehow different, the font becomes smaller.
Vue.js has a small form in the middle of the site.
Link

Answer 1

The fault is chunk-vendors.cda6abe8.css, i.e. css compiled from the used libraries. There you have normalize.css enabled and the devil knows what else.
This line from there is specifically to blame for the height:

body, html {
    height: 100%;
}

but there's a lot more out there.
See what libraries you used for the form and throw them out in the cold, because. they don't make Vue work in an embeddable way.

Answer 2

It's probably a matter of Vue itself. There is something wrong with your styles. I will assume that height: 100% does not work with flexbox as you would expect. That's what happens. By the way, I see this bug in Firefox