table 内 textarea 周围的间隙

Question

我已经做了一些研究来消除我在 table 中的文本区域周围的空白。根据浏览器的不同，它会出现在顶部（IE，Chrome）或底部（Firefox）。

<table border="0">
    <tr>
         <form method="POST" action="updatereview.php">
              <td class="shrink">
                  text
              </td>
              <td class="shrink">
                   <select name='update_score'>
                       <option  value="1">1</option>
                       <option  value="2">2</option>
                       <option  value="3">3</option>
                   </select>
                   <input type="textbox" name="new_retailer">
              </td>
              <td class="one-long-line">
                   <div id="content" style="width:100%;">
                       <textarea name="review_comment" rows="10" style="resize:none;">some text here</textarea>
                   </div>                   
              </td>
         </form>          
     </tr>
</table>

我没有把我所有的 CSS 都包括在这里，因为有很多，但我已经把它全部放在一个 jsfiddle 中：https://jsfiddle.net/9xmx2dex/1/ CSS for textarea 就在结束。

经过一些研究，将 "vertical-align: top;" 添加到我的 CSS 应该可以解决这个问题，但无济于事。感谢任何帮助，谢谢。

Answer 1

在您的 table tr:nth-child(odd) td 规则中，将 vertical-align: text-top; 更改为 vertical-align: top;

jsFiddle example

table 内 textarea 周围的间隙

Gap around textarea within a table

css

textarea