我有一个带有1个HTML和1个CSS文件的静态页面。当我测试页面并键入多行textarea（页面上的最后一个）直到页面溢出时，它不会。 ID为“居中”的div的高度为“适合内容”，对其进行检查表明它确实适合内容并且确实溢出，但是浏览器没有显示滚动条。同样，scrollBy不起作用。它不仅是一个浏览器（Chrome桌面，android； Firefox桌面，android）。
这里是index.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Formr.io</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600&display=swap" rel="stylesheet">
<!-- Stylesheets -->
<link rel="stylesheet" type="text/css" href="index.css">
<script defer>
document.addEventListener('DOMContentLoaded', () => {
document.querySelectorAll(".long-answer").forEach((el) => {
let offset = el.offsetHeight - el.clientHeight;
el.addEventListener('input', function (event) {
event.target.style.height = 'auto';
event.target.style.height = event.target.scrollHeight + offset + 'px';
});
});
});
</script>
</head>
<body>
<div id="centered">
<!-- Header -->
<div class="question-container">
<div class="form-header-color-bar"></div>
<div class="form-header-title">Тест върху "Неразделни"</div>
<div class="form-header-desc">Упражнителен тест върху "Неразделни"</div>
</div>
<br>
<!-- Questions -->
<div class="question-container">
<div class="question-title">Име и клас <span style="color: red;">*</span></div>
<br>
<div class="text-answer-container">
<input placeholder="Вашия отговор." class="short-answer" type="text" />
</div>
</div>
<br>
<div class="question-container">
<div class="question-title">Какво мислите за решението на Иво? Прекалил ли е? <span style="color: red;">*</span></div>
<br>
<div class="text-answer-container">
<input placeholder="Вашия отговор." class="short-answer" type="text" />
</div>
</div>
<br>
<div class="question-container">
<div class="question-title">Теза: "Той ме прегърнал с клони, аз съм в него вейки свряла." <span style="color: red;">*</span></div>
<br>
<div class="text-answer-container">
<textarea placeholder="Вашия отговор." class="long-answer"></textarea>
</div>
</div>
</div>
</body>
</html>
这里是index.css：
:root {
--main-color: #d08aff;
/*--background-color: #f8edff;*/
--background-color: rgb(240, 235, 248);
}
body {
background-color: var(--background-color);
margin: 0px;
}
#centered {
margin-top: 15px;
position: fixed;
transform: translate(-50%, 0%);
left: 50%;
width: 90%;
height: fit-content;
min-width: 100px;
max-width: 600px;
}
.question-container {
background-color: white;
padding: 0px 0px 15px 0px;
border-radius: 13px;
border: 1px solid #e6e3e8;
width: 100%;
height: fit-content;
}
.question-container .form-header-title {
font-family: 'Source Sans Pro', sans-serif;
word-break: break-all;
font-size: 24pt;
text-align: left;
margin-left: 15px;
margin-top: 10px;
margin-bottom: 0px;
}
.question-container .form-header-desc {
font-family: 'Source Sans Pro', sans-serif;
font-size: 10.5pt;
text-align: left;
margin-left: 15px;
margin-top: 10px;
margin-bottom: 0px;
word-break: break-all;
}
.question-container .form-header-color-bar {
margin: 0px;
width: 100%;
height: 15px;
background-color: var(--main-color);
border-radius: 13px 13px 0px 0px;
}
.question-container .question-title {
font-family: 'Source Sans Pro', sans-serif;
font-size: 14pt;
text-align: left;
margin-left: 15px;
margin-top: 10px;
margin-bottom: 0px;
word-break: break-all;
}
.question-container .text-answer-container .short-answer {
font-family: 'Source Sans Pro', sans-serif;
padding-left: 7px;
padding-right: 7px;
border: 1px solid var(--main-color);
border-radius: 7px;
height: 25px;
min-width: 91px;
max-width: 300px;
width: calc(100% - 14px);
}
.question-container .text-answer-container .short-answer:focus {
transition: 0.2s;
outline: none;
box-shadow: 0px 0px 5px 1px var(--main-color);
}
.text-answer-container {
margin-left: 15px;
margin-right: 15px;
}
.question-container .text-answer-container .long-answer {
font-family: 'Source Sans Pro', sans-serif;
padding-left: 7px;
padding-right: 7px;
border: 1px solid var(--main-color);
border-radius: 7px;
min-width: 91px;
max-width: 300px;
width: calc(100% - 14px);
resize: none;
overflow: hidden;
}
.question-container .text-answer-container .long-answer:focus {
transition: 0.2s;
outline: none;
box-shadow: 0px 0px 5px 1px var(--main-color);
}
感谢您的时间。