Why does the form block go beyond the page, and the input behind the form?

Question

css

Why does the form block pop out of the page, while the input pops out of the form (form pops out of the page when the page's width is less than its max-width)?
How to fix?
box-sizing: border-box doesn't help
Site - fixpc.tk , form below, see F12, otherwise the form has no frame

Answer 1

form {
  width: 100%;
  max-width: 540px;
        /*...*/
}
.input {
  display: block;
  margin: 8px;
  padding: 9px;
  width: 100%;
}
/*100% = 540px, прибавляем еще по 9px padding и получаем = 558px*/

you need to specify the width - width: 522px;for the content form(input, textarea..)
For rubber layout:

.input {
  display: block;
  margin: 8px;
  padding: 9px 2%;
  width: 96%;
}