title: HTML, CSS - Make text box width same
body: <p>I have this page with 1st row having 2 text boxes and 2nd row having a text box. I want to make their width same, the 
  below code works fine in chrome, but in firefox and IE (tested in IE9) width are different. How can I make the width same 
  in all browsers?</p>
  
  <p><a href="https://output.jsbin.com/rukikeruya" rel="nofollow noreferrer">JS Bin</a>   </p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;body&gt;
  &lt;form&gt;
      &lt;input type="text" name="cnop" size="2"/&gt;&lt;input type="text" name="cno" style="width:122px;"/&gt;&lt;br&gt;
      &lt;input type="text" name="cpono"/&gt;
  &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>Chrome</strong></p>
  
  <p><img src="https://i.stack.imgur.com/OeR9v.jpg" alt="enter image description here"></p>
  
  <p><strong>Firefox</strong> </p>
  
  <p><img src="https://i.stack.imgur.com/H7Ybu.jpg" alt="enter image description here"></p>