form { display: flex; flex-direction: column; width: 500px; margin: 0 auto; } form label { font-weight: bold; } form input[type="text"], form input[type="number"] { padding: 10px; font-size: 16px; border: 1px solid #ccc; border-radius: 4px; margin-bottom: 20px; } form input[type="submit"] { background-color: #4CAF50; color: white; font-size: 16px; padding: 12px 20px; border: none; border-radius: 4px; cursor: pointer; } form input[type="submit"]:hover { background-color: #45a049; } #bmi-output { font-size: 32px; font-weight: bold; margin-top: 20px; text-align: center; } Weight (kg): Height (cm): // Get form and output elements const form = document.getElementById('bmi-form'); const output = document.getElementById('bmi-output'); // Add submit event listener to form form.addEventListener('submit', event = { // Prevent form submission event.preventDefault(); // Get weight and height values const weight = form.elements.weight.value; const height = form.elements.height.value; // Calculate BMI const bmi = weight / (height / 100) ** 2; // Update output element with calculated BMI output.textContent = `Your BMI is ${bmi.toFixed(2)}`; });