パネルをC＃Web Appパネルの内側に配置するには？

Question

パネルにあるテーブルを垂直に整列しようとしていますが、スタイルプロパティをテーブルに適用すると機能しません。私のコードは以下のとおりであるとして、それにスタイルプロパティの何の効果もないでしょう意味、ここにご提案のための

<asp:Panel ID="Panel1" runat="server" 
     style="z-index:0;left:250px;position:absolute;top:160px; height: 160px; padding:10" 
     BackColor="Green" Width="300px"> 
     <div style="width: 295px; height: 155px;" align= "center"> 
     <table style="height: 48px; width: 187px; margin-left:0px; min-height:14px; min-width:55px; vertical-align:bottom" align="center" bgcolor="green" > 
    <tr> 
    <td> 
     <asp:Label ID="Label2" runat="server" Text="UserName" ForeColor="White"></asp:Label> 
    </td> 
    <td> 
     <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <asp:Label ID="Label3" runat="server" Text="Password" ForeColor="White"></asp:Label> 
    </td> 
    <td> 
     <asp:TextBox ID="TextBox2" textmode="Password" runat="server"></asp:TextBox> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <asp:Label ID="Label4" runat="server" ForeColor="White"></asp:Label> 
    </td> 
    <td> 
     <asp:Button ID="Button1" runat="server" Text="Login" onclick="Button1_Click" /> 
    </td> 
    </tr> 
    </table> 
    </div> 
    </asp:Panel> 

希望

Answer 1

あなたの場合は、親コンテナ内の一部のコンテンツの垂直方向の配置は常に注意が必要ですコンテンツの高さを知らない解決策は、親要素&の間にラッパーdivを入れることです。次に、外側のコンテナを"display:table"に、ラッパーdivを"display:table-cell"で中央に垂直に並べます。説明のために、このフィドルを参照してください。この方法の詳細についてはhttp://jsfiddle.net/myXL3/3/

、この優れた記事を参照してください。http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

Answer 2

問題は、あなたがdiv要素内のテーブルを持っているということです。 divのスタイルにvertical-align:middleを追加すると効果があります。これは、divが（コードスニペットの場合のように）常にテーブルより "高い"と仮定しています。

（また、あなたはtableさんにスタイルを余裕を持っている - 彼らは垂直方向の配置に干渉していないことを確認するために除去しなければならない）