2012-07-16 29 views
1

我有一個包含5列和多行的html表格。第一列由標籤和其他文本框組成。列數可能會根據數據而有所不同。HTML表格數據在Chrome中重疊

每列的寬度由百分比(100%除以列數)平均分配。

在IE中,如果標籤文本很長,第一列(標籤)會自動擴展。但在Chrome中它並沒有擴大。

請問我需要申請第一欄的哪種風格?

以下是表中的服務器端代碼:

 TableRow headerRow = new TableRow(); 
     foreach (string s in columns) 
     { 
      TableCell cell = new TableCell(); 
      cell.Width = Unit.Percentage(100.00/colsCount); 
      cell.BorderColor = Color.White; 
      cell.BorderStyle = BorderStyle.None; 
      System.Web.UI.WebControls.Label tb = new System.Web.UI.WebControls.Label(); 
      //tb.TextMode = TextBoxMode.MultiLine; 
      //tb.Width = Unit.Percentage(100.00); 
      //tb.Height = Unit.Pixel(45); 


      tb.ID = "TextHeaderBoxRow" + s; 
      tb.BackColor = Color.FromArgb(211, 230, 254); 
      tb.BorderColor = Color.White; 
      tb.BorderStyle = BorderStyle.Solid; 
      tb.BorderWidth = Unit.Pixel(0); 
      tb.Font.Bold = true; 
      tb.Text = s; 
      //tb.Attributes.Add("style", "overflow :hidden"); 
      tb.Font.Name = "Tahoma"; 
      tb.Font.Size = FontUnit.Point(9); 
      //tb.ReadOnly = true; 
      tb.TabIndex = -1; 

      cell.Controls.Add(tb); 
      headerRow.Cells.Add(cell); 
     } 
     Table1.Rows.Add(headerRow); 

     // Now iterate through the table and add your controls 
     for (int i = 0; i < rowsCount; i++) 
     { 
      TableRow row = new TableRow(); 
      row.Style.Add(HtmlTextWriterStyle.PaddingRight, "5px"); 
      row.Width = Unit.Percentage(100.00); 

      for (int j = 0; j < colsCount; j++) 
      { 
       TableCell cell = new TableCell(); 
       cell.BorderColor = Color.White; 
       cell.Width = Unit.Percentage(100.00/colsCount); 
       TextBox tb = new TextBox(); 
       tb.Width = Unit.Percentage(100.00); 
       tb.Font.Name = "Tahoma"; 
       tb.Font.Size = FontUnit.Point(9); 
       tb.Attributes.Add("onchange", "javascript:Changeflag()"); 
       tb.Attributes.Add("onkeyup", "javascript:Changeflag()"); 

       // Set a unique ID for each TextBox added 
       tb.ID = "TextBoxRow_" + i + "Col_" + j; 

       // Add the control to the TableCell 
       cell.Controls.Add(tb); 
       // Add the TableCell to the TableRow 
       row.Cells.Add(cell); 
      } 
      // Add the TableRow to the Table 
      Table1.Rows.Add(row); 
     } 
+1

你可以發佈一些代碼或jsfiddle嗎? – JSW189 2012-07-16 13:11:13

回答

0

Chrome的以下你告訴它做什麼。您指定所有寬度應該相等,因此它將包裝標籤。 IE正在做你想做的事,但不是你告訴它做的事。

如果您無法指定第一列的寬度足夠大以至於沒有任何環繞,則可以嘗試將添加到標籤的樣式。

+0

我應用了「White-space:nowrap」風格,但它不適用於Chrome – Iraiyavan 2012-07-17 06:59:25