Fake-Table

by Liang JiaWei

HTML

<div style="display:table-row">
  <div style="width:20%;display:table-cell">
    <img src="http://via.placeholder.com/140x86" style="dispaly:block;max-width:100%" alt="icon">
  </div>
  <div style="width:60%;display:table-cell"></div>
  <div style="width:20%;display:table-cell;vertical-align: middle;">
      <div><input type="text" style="width:100%"></div>
      <div><input type="text" style="width:100%"></div>
  </div>
</div>
<div style="display:table-row">
<div style="width:20%;display:table-cell"></div>
<div style="width:60%;display:table-cell">
  <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi illum corporis at ipsum, eaque esse assumenda facere sunt tempore soluta eveniet libero inventore! Nobis in magnam numquam soluta quae nulla.</div>
  <div>Recusandae reprehenderit ipsam ducimus excepturi amet porro doloremque officia eveniet voluptatibus accusamus impedit suscipit possimus tenetur magni similique minus, asperiores nulla, quod ipsum sapiente maiores, odit ullam. Voluptate voluptates, inventore.</div>
  <div>Dolorum repudiandae, totam repellendus nam, fugiat, rerum molestiae laboriosam fuga aperiam nihil sit perferendis sequi error. Exercitationem accusamus nobis explicabo, delectus, dolorum sequi! Tempore minus adipisci a neque? Sit, aperiam!</div>
  <div>Quas ex deserunt et in facere placeat, incidunt totam neque sit impedit itaque sequi quae a error quisquam laudantium tenetur obcaecati magni ipsa velit quia cupiditate culpa? Unde veniam, adipisci.</div>
  <div>Excepturi asperiores, nostrum omnis. Sapiente vero aut necessitatibus repellat, voluptate ex sunt consequatur voluptas quam, veritatis aliquam odit expedita delectus, ipsa nulla maxime vitae rerum repellendus commodi nemo eum sit!</div>
  <div>Vel itaque esse vitae labore maxime architecto reprehenderit. Consectetur vero blanditiis magni error autem deserunt odit fuga quas totam velit in molestiae fugiat sed, esse, porro nam earum. Eum, deleniti!</div>
  <div>Dolorum...