textarea的（ASP：文本框的TextMode =「多行」）重疊的按鈕

Question

我在此問題與表單按鈕重疊一個asp

：Texbox用的TextMode設置爲多行： alt text http://www.nango.co.uk/forums/uploads/1251792203/gallery_2_3_18518.jpg

下面是代碼：

<asp:Panel ID="pnlGiftStep" Visible="false" runat="server"> 
       <img src="/images/shopping-cart/form-separator.png" alt="separator" /> 
       <div class="form-title">GIFT OPTIONS</div> 
       <div class="row"> 
        <asp:TextBox ID="txtGiftName" Height="31" Width="323" BorderStyle="None" Font-Names="Arial" 
         Font-Size="116.7%" runat="server"></asp:TextBox> 
        <cc1:TextBoxWatermarkExtender ID="wmeGiftName" 
         TargetControlID="txtGiftName" WatermarkText="Gift Name" 
         WatermarkCssClass="watermark" runat="server"></cc1:TextBoxWatermarkExtender> 
       </div> 
       <br class="clear" /> 
       <div class="row"> 
        <asp:TextBox ID="txtGiftMessage" Rows="5" Width="323" BorderStyle="None" 
         Font-Names="Arial" TextMode="MultiLine" 
         Font-Size="116.7%" runat="server"></asp:TextBox> 
        <cc1:TextBoxWatermarkExtender ID="wmeGiftMessage" 
         TargetControlID="txtGiftMessage" WatermarkText="Gift Message" 
         WatermarkCssClass="watermark" runat="server"></cc1:TextBoxWatermarkExtender> 
       </div> 
       <br class="clear" /> 
       <div class="button-row"> 
        <asp:ImageButton ID="imbShippingDetails" 
         ImageUrl="/images/shopping-cart/ship-details-btn.png" 
         OnClick="ReturnToShipping" 
         ValidationGroup="shipping" 
         runat="server" /> 
        <asp:ImageButton ID="imbPayDetails" ImageUrl="/images/shopping-cart/pay-details-btn.png" 
         ValidationGroup="pay" 
         runat="server" /> 
       </div> 
       <br class="clear" /> 
      </asp:Panel> 

這裏是CSS：

.row 
{ 
    float:left; 
    height:40px; 
} 

.button-row 
{ 
    float:left; 
    width:323px; 
    text-align:right; 
} 

任何想法如何，我可以停止？

謝謝。

Answer 1

它的鋪設完全按照您的說法進行。您分配的類.row的高度屬性爲40px。由於您指定了高度，因此容器div僅爲40 px高，這就是您的按鈕出現在其頂部的原因。如果您在持有textarea的div中添加style="overflow: hidden"，您會注意到該textarea的大部分消失了。您將需要添加一個覆蓋height屬性的新樣式，或者將該類從該div中移除。

處理這些佈局問題時，將border或background-color屬性添加到您正在懷疑的類中以幫助您可視化發生的情況可能會有所幫助。在這種情況下，您的多行文本框溢出40px div之外。