表格單元格定位問題

我正在創建一個表格，代碼文件後面的代碼&將佔位符。表格單元格定位問題

//在Main.aspx

MyControl control1 = (MyControl)Page.LoadControl("MyControl.ascx"); 
control1.ID = "ctl1"; 
MyControl control2 = (MyControl)Page.LoadControl("MyControl.ascx"); 
control2.ID = "ctl2"; 
MyControl control3 = (MyControl)Page.LoadControl("MyControl.ascx"); 
control3.ID = "ctl3"; 
MyControl control4 = (MyControl)Page.LoadControl("MyControl.ascx"); 
control4.ID = "ctl4"; 

Table table = new Table(); 

TableCell cell1 = new TableCell(); 
TableCell cell2 = new TableCell(); 
TableCell cell3 = new TableCell(); 
TableCell cell4 = new TableCell(); 
TableRow row1 = new TableRow(); 
table.Style.Add(HtmlTextWriterStyle.Position, "absolute"); 

cell1.Controls.Add(control1); 
row1.Cells.Add(cell1); 
cell1.Style.Add(HtmlTextWriterStyle.Position, "absolute"); 
cell2.Controls.Add(control2); 
row1.Cells.Add(cell2); 
cell2.Style.Add(HtmlTextWriterStyle.Position, "absolute"); 
cell3.Controls.Add(control3); 
row1.Cells.Add(cell3); 
cell3.Style.Add(HtmlTextWriterStyle.Position, "absolute"); 
cell4.Controls.Add(control4); 
row1.Cells.Add(cell4); 
cell4.Style.Add(HtmlTextWriterStyle.Position, "absolute"); 

table.Rows.Add(row1); 
placeHolder1.Controls.Add(table);

//在MyControl.ascx（在這裏，我將控制;其與JavaScript創建）

<table cellpadding="0" cellspacing="0" border="0" width="217px" 
    style="position:relative" > 
<tr> 
    <td > 
    <div id="c1" class="gauge" style="margin:0;padding:0;height:169px;width:217px;"> 
    </div> 
    </td> 
</tr>

//在用戶控制的CSS中

div.gauge 
{ 
    background-repeat: no-repeat; 
    background-position: top center; 
    height: 169px; 
    margin: 0px; 
    overflow: visible; 
    position: absolute; 
    width: 217px; 
    z-index: 0; 
}

但是我看到只有第一個控件被加載，其他的沒有。有什麼遺漏？

來源

2012-09-14 benjamin54

這是可怕的重複碼呈現，之前我甚至繼續讀書，讓我們清理。

// Initializing parents at the top. 
Table table = new Table(); 
table.Style.Add(HtmlTextWriterStyle.Position, "absolute"); 

TableRow row = new TableRow(); 

// For loop, you could turn this in a foreach to load controls based on an array. 
for (int i = 1; i <= 4; ++i) 
{ 
    MyControl control = (MyControl) Page.LoadControl("MyControl.ascx"); 
    control.ID = "ctl" + i.toString(); 

    TableCell cell = new TableCell(); 
    cell.Controls.Add(control); 
    cell.Style.Add(HtmlTextWriterStyle.Position, "absolute"); 
    row.Cells.Add(cell) 
} 

table.Rows.Add(row); 
placeHolder.Controls.Add(table);

更清晰的閱讀，更容易發現錯誤。然而，由於您沒有看到四個按鈕，所以它不是正確的地方，所以您必須檢查HTML。使用適當的Web開發工具，您可以將元素懸停在DOM樹中，您會看到它們彼此重疊。

而且使用上述改進的代碼，很容易抵消它們，只需使用i爲... :)

div.gauge 
{ 
    background-repeat: no-repeat; 
    background-position: top center; 
    height: 169px; 
    margin: 0px; 
    overflow: visible; 
    position: absolute; 
    width: 217px; 
    z-index: 0; 
}

你真的需要所有這些屬性？

您指定position: absolute但實際上沒有定位元素？ overflow: visible是否有意義？ z-index: 0是怎麼回事，爲什麼要指定？

來源

2012-09-14 15:11:06

謝謝你的時間。實際上我使用這個尺寸：http://www.dariancabot.com/projects-2/jgauge/由於它是用多層創建的，因此每個圖層都有不同的z索引。 – benjamin54

所有四個控制是有，問題是絕對定位

所有四種具有相同的x和y定位，不管是在表的內部;

刪除絕對片刻，看到他們在頁面

來源

2012-09-14 15:07:26 RollRoll

嗯，我試着讓靜態/相對;但仍然沒有成功。 – benjamin54

表格單元格定位問題

回答

相關問題