<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Feet/Inches ⇄ Meters & Lbs ⇄ Kgs Converter</title>
<style>
body { font-family: Arial, sans-serif; padding: 20px; }
label, input { margin: 5px; }
input { width: 60px; }
.section { margin-bottom: 20px; }
</style>
</head>
<body>
<h2>Feet/Inches ⇄ Meters & Lbs ⇄ Kgs Converter</h2>
<div class="section">
<label for="feet">Feet:</label>
<input type="number" id="feet" oninput="feetInchesToMeters()" />
<label for="inches">Inches:</label>
<input type="number" id="inches" oninput="feetInchesToMeters()" />
<p id="metersResult">Meters: —</p>
</div>
<div class="section">
<label for="meters">Meters:</label>
<input type="number" id="meters" step="0.01" oninput="metersToFeetInches()" />
<p id="feetInchesResult">Feet & Inches: —</p>
</div>
<div class="section">
<label for="lbs">Pounds (lbs):</label>
<input type="number" id="lbs" step="0.1" oninput="lbsToKgs()" />
<p id="kgsResult">Kilograms: —</p>
</div>
<div class="section">
<label for="kgs">Kilograms (kg):</label>
<input type="number" id="kgs" step="0.1" oninput="kgsToLbs()" />
<p id="lbsResult">Pounds: —</p>
</div>
<script>
function feetInchesToMeters() {
const feet = parseFloat(document.getElementById("feet").value) || 0;
const inches = parseFloat(document.getElementById("inches").value) || 0;
const meters = (feet * 0.3048) + (inches * 0.0254);
document.getElementById("meters").value = meters.toFixed(3);
document.getElementById("metersResult").textContent = `Meters: ${meters.toFixed(3)}`;
}
function metersToFeetInches() {
const meters = parseFloat(document.getElementById("meters").value) || 0;
const totalInches = meters / 0.0254;
const feet = Math.floor(totalInches / 12);
const inches = Math.round(totalInches % 12);
document.getElementById("feet").value = feet;
document.getElementById("inches").value = inches;
document.getElementById("feetInchesResult").textContent = `Feet & Inches: ${feet} ft ${inches} in`;
document.getElementById("metersResult").textContent = `Meters: ${meters.toFixed(3)}`;
}
function lbsToKgs() {
const lbs = parseFloat(document.getElementById("lbs").value) || 0;
const kgs = lbs * 0.45359237;
document.getElementById("kgs").value = kgs.toFixed(2);
document.getElementById("kgsResult").textContent = `Kilograms: ${kgs.toFixed(2)}`;
}
function kgsToLbs() {
const kgs = parseFloat(document.getElementById("kgs").value) || 0;
const lbs = kgs / 0.45359237;
document.getElementById("lbs").value = lbs.toFixed(2);
document.getElementById("lbsResult").textContent = `Pounds: ${lbs.toFixed(2)}`;
}
</script>
</body>
</html>