HTML Form How to - height of input to match the submit's height








Question

We would like to know how to height of input to match the submit's height.

Answer


<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
body {<!--  w ww  .  j a v  a2  s . co  m-->
  position: absolute;
  height: 100%;
}

form {
  position: relative;
  height: 50%;
}

input[type="text"] {
  height: 100%;
}

input[type="submit"] {
  height: 100%;
}
</style>
</head>
<body>
  <form>
    <input type="text"> <input type="submit">
  </form>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt
  officiis earum accusamus dolor illo omnis expedita ad vitae voluptatum
  ab adipisci tempore impedit exercitationem. Aliquam minus excepturi
  culpa adipisci vero.
</body>
</html>

The code above is rendered as follows: