1

我在我的代码隐藏文件中为每个用户创建了一个表。我想将每个表格添加到面板中,以便所有表格水平显示。该表只有 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>
4

1 回答 1

1

您正在将 css 添加float:left到父容器,即您的面板。

因此您的标记变为:

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

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

因此它不适用于内在的孩子

您应该将其添加到各个表中,即

像这样做:

假设你tdrSystem.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
       }
}
于 2013-03-20T07:37:10.570 回答