title: How to fit a select tag in a table cell properly
body: <p>I am desperately trying to make a select tag fit in a table cell like it belongs there, not like someone wedged it in with a crowbar.  Here is the code followed by the picture of how it appears:</p>
  
  <pre><code>&lt;tr&gt;
    &lt;td class="lblCell_L" &gt;ISIN Code &lt;/td&gt;
    &lt;td id="ISINcb" class="lblCell_R" align="center"&gt;
     &lt;select id='isinz' width="144" style="height:19px; width:140px; text-align:center;"&gt;
         &lt;option id="ISIN1" onclick="JavaScript:quarterUpdate()" &gt;A&lt;/option&gt;
         &lt;option id="ISIN2" onclick="JavaScript:quarterUpdate()" &gt;B&lt;/option&gt;
         &lt;option id="ISIN3" onclick="JavaScript:quarterUpdate()" &gt;C&lt;/option&gt;
         &lt;option id="ISIN4" onclick="JavaScript:quarterUpdate()" &gt;E&lt;/option&gt;
     &lt;/select&gt;
    &lt;/td&gt;
    &lt;td class="lblCell_tx" id="isinOptions" style="color:#a56;"&gt;0&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>The way this comes out in FireFox:</p>
  
  <p><img src="https://i.stack.imgur.com/CAowX.png" alt="Select Tag has its own border inside the cell borders"></p>
  
  <p>So, this is really ugly because the Select object has its own borders visible inside the cell, which has its own borders.  It is like stuffing a goose with pork... dismal looking!</p>
  
  <p>Can the table cell borders be suppressed to allow the Select Tag borders to take their place?  </p>
  
  <p>You may notice, also, that the height of that cell is higher than the other "<em>text-only</em>" cell.</p>