在兩個不同的行上有兩個div

Question

我有以下代碼。我基本上想要兩行，第一行左邊是一個文件上傳器，右邊是一個按鈕，下一行是消息，但下面的代碼將標籤放在文件上載器和按鈕之間的第一行中。

<style> 
    .balUploader 
    { 
     margin:0px 0px 0px 0px; 
     padding:0px 0px 0px 0px; 
     width:80%; 
     float:left; 
    } 
    .balUploaderCleaner 
    { 
     margin:0px 0px 0px 0px; 
     padding:0px 0px 0px 0px; 
     float:right; 
    } 
</style> 

<div> 
    <div> 
     <asp:FileUpload ID="uploader" CssClass="balUploader" runat="server"/> 
     <asp:ImageButton ID="uploaderEraser" CssClass="balUploaderCleaner" OnClick="uploaderEraser_Click" runat="server" Width="25" Height="25" /> 
    </div> 
    <asp:Label ID="fileSizeError" runat="server" ForeColor="Red">bla bla bla bla bla bla</asp:Label> 
</div> 

Answer 1

第一div只包含浮動的元素，它的高度被計算爲0，爲克服的方法之一是使用clear荷蘭國際集團的修復。

<style> 
    .clearFix:before, 
    .clearFix:after { 
     content: " "; 
     display: table; 
     height: 0; 
     clear: both; 
     overflow: hidden; 
     visibility: hidden; 
    } 
    .balUploader 
    { 
     margin:0px 0px 0px 0px; 
     padding:0px 0px 0px 0px; 
     width:80%; 
     float:left; 
    } 
    .balUploaderCleaner 
    { 
     margin:0px 0px 0px 0px; 
     padding:0px 0px 0px 0px; 
     float:right; 
    } 
</style> 

<div> 
    <div class="clearFix"> 
     <asp:FileUpload ID="uploader" CssClass="balUploader" runat="server"/> 
     <asp:ImageButton ID="uploaderEraser" CssClass="balUploaderCleaner" OnClick="uploaderEraser_Click" runat="server" Width="25" Height="25" /> 
    </div> 
    <asp:Label ID="fileSizeError" runat="server" ForeColor="Red">bla bla bla bla bla bla</asp:Label> 
</div>