Vertical Size
Horizontal Size
Horizontal Size
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dynamic Box</title>
<style>
#box {
border: 1px solid black;
padding: 10px;
margin: 10px;
}
</style>
</head>
<body>
<input type="number" id="heightInput" value="100"> Vertical Size
<br>
<input type="number" id="widthInput" value="500"> Horizontal Size
<br>
<div id="box"></div>
<input type="text" id="textInput" placeholder="Type something...">
<script>
const heightInput = document.getElementById('heightInput');
const widthInput = document.getElementById('widthInput');
const box = document.getElementById('box');
const textInput = document.getElementById('textInput');
heightInput.addEventListener('input', function() {
box.style.height = this.value + 'px';
});
widthInput.addEventListener('input', function() {
box.style.width = this.value + 'px';
});
textInput.addEventListener('input', function() {
box.innerText = this.value;
});
</script>
</body>
</html>
```
ジョーク：なぜプログラマーはコーヒーを飲みすぎるのか？A：因数があれば暗号解読が早くなると思って。