表格单元格定位问题

我正在创建一个表格，代码文件后面的代码&将占位符。表格单元格定位问题

//在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

表格单元格定位问题

回答

相关问题