Java HTML / XML How to - Place Image and Table side by side HTML with ratio of 50-50








Question

We would like to know how to place Image and Table side by side HTML with ratio of 50-50.

Answer

<!DOCTYPE html>/*  w w  w  .j a  va  2s. c om*/
<html>
<head>
<style type='text/css'>
#one {
  width: 50%;
  float: left;
  height: 100px;
}

#two {
  width: 50%;
  float: left;
  height: 100px;
}

td, tr, table {
  border: 1px solid black;
  text-align: center;
}
</style>
</head>
<body>
  <img id="one" src="http://placehold.it/400x400" />
  <table id="two">
    <tr>
      <td>123</td>
      <td>456</td>
    </tr>
  </table>
</body>
</html>