如何在 ASP.NET 中垂直對齊對象？

我一直在使用 asp.net 一段時間，並且總是在將對象與同一行的不同高度對齊時遇到問題。例如，在這種情況下，我有一個搜尋標籤、一個文本欄位，然後是一個圖像按鈕。使這三個項目正確對齊的“正確方法”是什麼？

我現有的程式碼：

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
  </asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
   <asp:Panel VerticalAlign="Center" runat="server">
   <asp:Label ID="Label1" runat="server" Font-Size="X-Large" Text="Search Tests:"></asp:Label>
   <asp:TextBox ID="searchTextBox" runat="server" Font-Size="X-Large" 
       Height="30px" style="margin-left: 13px; margin-top: 0px" Width="219px"></asp:TextBox>
   <asp:ImageButton ID="ImageButton2" runat="server" Height="45px" 
       ImageUrl="~/Images/SearchButton.PNG" style="margin-left: 18px; margin-top: 0px" 
       Width="95px" />
   </asp:Panel>
</asp:Content>

最簡單的是使用 CSS 或表格。我放了一個高度和垂直對齊頂部的 div。 CSS 參考

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
   <asp:Panel ID="Panel1" VerticalAlign="Center" runat="server">
       <div style="height: 40px; vertical-align: top">
           <div style="padding-top: 10px; float:left;">
               <asp:Label ID="Label1" runat="server" Font-Size="X-Large" Text="Search Tests:"></asp:Label>
           </div>
           <div style="padding-top: 5px; float:left;">
               <asp:TextBox ID="searchTextBox" runat="server" Font-Size="X-Large" Height="30px"
                    Style="margin-left: 13px; margin-top: 0px" Width="219px"></asp:TextBox>
           </div>
           <div style="padding-top: 5px; float:left;">
               <asp:ImageButton ID="ImageButton2" runat="server" Height="45px" ImageUrl="~/Images/SearchButton.PNG"
                    Style="margin-left: 18px; margin-top: 0px" Width="95px" />
           </div>
       </div>
   </asp:Panel>
</asp:Content>

引用自：https://stackoverflow.com/questions/8319791