Question

是否可以将文本框和图像对齐在同一行，这样它们都占据了单元格宽度的100％？（没有设置文本框的特定宽度，如宽度：95％）

   <table style="margin: 0px;float:left" border="1"  width="50%" cellpadding="5" cellspacing="5">
      <thead>
        <tr>
           <td class="title" colspan="2">
              Options
           </td>
         </tr>
       </thead>
       <tbody>
         <tr>
           <td class="header" style="width: 110px;">
              Date                        
           </td>
           <td>           
             <input name="txtRelease" type="text" id="txtRelease" style="float:left;display: block;width: 100%;height: 100%;" /><input type="image" name="ImageButton1" id="ImageButton1" style="float:left;" src="http://www.classiclodges.co.uk/images/icon_date_picker.jpg" style="border-width:0px;float:right" />                       
          </td>                                            
     </tbody>
 </table>

http://www.webdevout.net/test?01O&raw

Answer 1

您可以将图像作为文本框中的背景。在你的文本框css上试试这个。

background: url("http://www.classiclodges.co.uk/images/icon_date_picker.jpg") no-repeat scroll right center transparent;

Answer 2

我使用了包装元素和绝对定位。

现场演示： http://jsfiddle.net/62sAU/6/

替代布局（添加了一些填充）：http://jsfiddle.net/62sAU/7/

Answer 3

你想这样吗？ http://www.jsfiddle.net/Tt5gu/

为此，您必须以像素为单位展开宽度并设置宽度。

总之，您无法很好地设置宽度值。你必须计算宽度：）

在表格单元格中对齐文本框和图像

3 个答案: