Question

我在我的代码隐藏文件中为每个用户创建了一个表。我想将每个表添加到面板，以便所有表格都水平显示。表只有1个库存和多行。因此，每个表应添加在上一个表的一侧我尝试过css样式float:left，但它没有起作用。

这是我的代码

C＃部分：

  foreach( DataRow dr in t.Rows )
  { 
       if(........)
       {    
           tdr.Width = "200px";
           row = new HtmlTableRow(); 
           cell = new HtmlTableCell();

           row = new HtmlTableRow(); 
           cell = new HtmlTableCell();
           cell.InnerText = doc;
           row.Cells.Add(cell);
           tdr.Rows.Add(row);
           row = new HtmlTableRow(); 
           cell = new HtmlTableCell();
           cell.InnerText = "No Timming";
           row.Cells.Add(cell);
           tdr.Rows.Add(row);
           row = new HtmlTableRow(); 
           cell = new HtmlTableCell();
           cell.InnerText = weekday[i];
           row.Cells.Add(cell);
           tdr.Rows.Add(row);
       }
       //dr_list is my panel name 
       //tdr is my table name 
       this.DR_list.Controls.Add(tdr);
   }

CSS部分：

<style>
    .float-left
     {
        float: left;
     }
</style>

ASP.NET部分：

<asp:Panel ID="DR_list" runat="server" Direction="LeftToRight" Height="227px" 
    HorizontalAlign="Left" ScrollBars="Auto" Wrap="False"  
    CssClass='float-left' Width="1103px" >
</asp:Panel>

Answer 1

您正在将css float:left添加到父容器，即您的Panel。

因此你的标记就像：

<div id="DR_list" class="float-left" >
    <table  width="200px">
     //table 1 markup
    </table>

    <table width="200px" >
     //table 2 markup
    </table>
</div>

因此它对内心的孩子不起作用

你应该将它添加到各个表格，即

这样做：

假设您的tdr为System.Web.UI.HtmlControls.HtmlTable

 tdr.Attributes.Add("class", "float-left");

这样你的最终标记就像

<div id="DR_list"  >
    <table  width="200px" class="float-left" >
     //table 1 markup
    </table>

    <table width="200px"  class="float-left" >
     //table 2 markup
    </table>
</div>

所以你的实际代码应该是

foreach( DataRow dr in t.Rows )
{ 
       if(........)
       {   
           tdr = new HtmlTable();
           tdr.Attributes.Add("class", "float-left"); 
           tdr.Width = "200px";

           row = new HtmlTableRow(); 
           cell = new HtmlTableCell();
           /////rest of the logic
       }
}

在水平布局中动态添加控件到面板

1 个答案: