绝对定位TR&道明元件

Question

我试图绝对定位一个 ASP.NET Datalist，它位于带有 TR & 的表内。 TD 元素 - 我有水平显示的 TR - 应用绝对定位仅显示最后一个 TD 元素。使用相对/静态显示整个 TD 元素，它应该是这样的 - 我需要将它绝对定位在一个位置 - 发现很难让它正确 - 有什么建议吗？

.AspNet-DataList table 
{ 
width: 200px;
}

.AspNet-DataList tr, .AspNet-DataList td 
{
float: left;
left: 250px;
padding-right: 2px;
position: absolute;
top: 304px;
}

.AspNet-DataList td a
{
text-indent: -9999em;
display:block;
height: 25px;
width: 25px;
}

这是一个逐步的表格，有一个圆形橙色背景，数字 1 到 6 水平显示 - 我想我提到它，以防万一你想到我想要实现的目标。我讨厌使用position:absolute，但有时它只是你当时需要的东西，没有它就无法做到。

这是表单和 div；

<div class="radarform">
<div class="look-for">Look For</div>
<div class="agree">Agree</div>
<div class="strongly-agree">Strongly Agree</div>
<div class="disagree">Disagree</div>
<div class="strongly-disagree">Strongly Disagree</div>
<energy:FormBuilder ID="HealthAndSafetyRadarForm" runat="server" XmlPath="~/asset/forms/securusradarform.xml" CssClass="hsRadarform" ButtonText="Send Form" ShowTitle="true" ShowSideBar="true" />
<div class="clear-me"></div>
</div>

在 Firefox FireBug 中，它显示了这一点，并且有我正在使用的自己的类；

<div id="ctl07_HealthAndSafetyRadarForm_Wizard_SideBarContainer_SideBarList" class="AspNet-DataList">

更新：我设法解决了这个问题 - 我正在定位 td，因此它们最终彼此重叠 - 我在桌子上做了这个，然后相对地定位了 hsRadarForm - 这已经解决了 -天哪，我讨厌立场：绝对。

.AspNet-DataList table 
{
left: 45px;
position: absolute;
top: -46px;
width: 175px;
}

.AspNet-DataList tr, .AspNet-DataList td 
{
float: left;
padding-right: 2px;
}

Answer 1

您可以将数据列表包装在 DIV 中并对其进行绝对定位吗？有时将东西放入容器中并绝对定位它们会更容易。

Answer 2

我很难理解你想要实现的目标 - 关于圆形橙色背景的东西？ - 但如果您确实需要重新定位 td 元素，则几乎肯定需要将 td、tr、tbody 和 table 设置为 display: block;