文本框和按钮不在同一水平线上，怎么解决？

两者在同一个table的同一tr中，本应该是水平对齐的，怎么感觉上下有些错位，同事说要用css才能解决这个问题。
不知道这个css该怎么写？

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

<table>
        <tr>
            <td style="width: 225px; height: 26px;">
            </td>
            <td style="width: 250px; height: 26px;">
                <asp:HyperLink ID="hlFirst" runat="server" Text="首页" Width="30px"  ></asp:HyperLink>
                <asp:HyperLink ID="hlPrevious" runat="server" Text="上页" Width="30px"  ></asp:HyperLink> 
                第<asp:Label ID="lblpage" runat="server"></asp:Label>页  <asp:HyperLink ID="hlNext" runat="server" Text="下页" Width="30px"  ></asp:HyperLink>
                <asp:HyperLink ID="hlLast" runat="server" Text="末页" Width="30px"  ></asp:HyperLink>
            </td>
            <td style="width: 225px; height: 26px;" align="right">
                跳转到<asp:TextBox ID="txtpage" runat="server" Width="20px" Height="15px"></asp:TextBox>页<asp:Button
                    ID="btnpage" runat="server" CausesValidation="False" Font-Size="X-Small" Height="20px"
                    Text="确定  " Width="45px" OnClick="btnpage_Click" UseSubmitBehavior="False"/>
                   
                共<asp:Label ID="lbltotal" runat="server"></asp:Label>页</td>
        </tr>
    </table>
将  Font-Size="X-Small" 去掉你使用了不同大小的字体所致
<table>
        <tr>
            <td style="width: 225px; height: 26px;">
            </td>
            <td style="width: 250px; height: 26px;">
                <asp:HyperLink ID="hlFirst" runat="server" Text="首页" Width="30px"  ></asp:HyperLink>
                <asp:HyperLink ID="hlPrevious" runat="server" Text="上页" Width="30px"  ></asp:HyperLink> 
                第<asp:Label ID="lblpage" runat="server"></asp:Label>页  <asp:HyperLink ID="hlNext" runat="server" Text="下页" Width="30px"  ></asp:HyperLink>
                <asp:HyperLink ID="hlLast" runat="server" Text="末页" Width="30px"  ></asp:HyperLink>
            </td>
            <td style="width: 225px; height: 26px;  vertical-align:middle" align="right">
                跳转到<asp:TextBox ID="txtpage" runat="server" Width="20px" Height="15px"></asp:TextBox>页<asp:Button
                    ID="btnpage" runat="server" CausesValidation="False" Font-Size="X-Small" Height="20px"
                    Text="确定  " Width="45px"  UseSubmitBehavior="False"/>
                   
                共<asp:Label ID="lbltotal" runat="server"></asp:Label>页</td>
        </tr>
    </table><td style="width: 225px; height: 26px;  vertical-align:middle" align="right">让它居中
好像不能放置在同个td里，不然肯定是排乱的，放置不同的td里！
如果一个<td>..</td>中有三个元素,要想分别调整这些元素的位置,
一般在这个<td>...</td>中再加一个一行三列的table,或加并列的三个DIV,
td高度26px, 文本框高度15px，按钮高度20px, 高度不同，就不平了。而且在不同的浏览器中，显示效果还不太相同。vertical-align:middle有时不起作用的。你可以这么试试看：
如果td必须26px，那么通过设定td的padding，把td内的内容高度限制在20px, 然后把文本框也设置成20px:<td style="width: 225px; height: 26px; padding-top: 3px; padding-bottom: 3px;" align="right">
                跳转到<asp:TextBox ID="txtpage" runat="server" Width="20px" Height="20px"></asp:TextBox>页<asp:Button
                    ID="btnpage" runat="server" CausesValidation="False" Font-Size="X-Small" Height="20px"
                    Text="确定  " Width="45px"  UseSubmitBehavior="False"/>
                   
                共<asp:Label ID="lbltotal" runat="server"></asp:Label>页</td>
不建议用内嵌table的方式来解决，还是用css比较好。
如果实在不行，则把每个控件都放在<span></span>里，然后设置每个<span></span>的padding-top，直到达到你想要的对齐方式为止
如果一个<td>..</td>中有三个元素,要想分别调整这些元素的位置,
一般在这个<td>...</td>中再加一个一行三列的table,或加并列的三个DIV,
<span>...</span>
用Css的padding来设置,只能是左右有效,而上下是无效的!!
把<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这个去掉试试
设置margin样式，不过ie的显示很诡异
这个必须边调试边修改.
要善用 margin-top vertical-align height line-height display:inline-block
font-size等CSS属性.