-3

我有一个 div，我用它作为容器来适应页脚的东西

#footcompatible { width:985px; height:50px; display:block; position:relative; left:0; top:0;  <--- FIXED changed to top = 50px (the height) and added bottom -50px}

这是母版页上的一些 HTML：

<asp:ContentPlaceHolder ID="MainContent" runat="server" />              
    <div id="footcompatible">
    <div class="footerbarsTop"><!-- insert footer bar --></div>
    <div id="footerblock"><%Html.RenderPartial(ViewData["footer"].ToString()); %></div>     
    <div class="footerbarsBot"><!-- insert footer bar --></div>
    </div>

contentplaceholder 被我页面中的内容替换，例如：explaining content blah blah text etc blah blah blahl

和上面的CSS：

.iceabtside {display:block; width:271px; height:auto; position:absolute; left:697px;      top:0; border:0px solid white; text-align:left;}
 also this is what i missed of on my initial paste 
.iceabtfm 
{
    display:block; width:661px; height:auto; position:relative; left:24px; top:0;    text-align:left;
 }

我希望在此之后出现页脚块，但我实际上得到的是它位于页面的一半而不是内容之上，我添加的内容越多无关紧要，它只是停留在它似乎为自己疯狂的地方，我不能绝对定位，因为我不知道上面内容的高度！如果我将它的定位移到内容的顶部，这很奇怪，现在有点头疼。

4

3 回答 3

2

我无法理解您的描述。你能改写一下，或者做一个在线例子或草图吗？

Anway，两个基本规则：

  • position: absolute是相对于主体或下一个祖先元素，其中一个position: absolute或relative设置。因此，在您的示例中，设置为的任何内容都footCompatible将position左上角absolute作为footCompatible起点（left = 0，top = 0），而不是整个文档。除了将元素从相对定位的元素中取出之外，没有办法解决这个问题。

  • Position: absolute从文档流中取出一个元素，使其浮动在所有其他元素之上（不要与float属性混淆，这有点不同。）不可能有一个position: absolute元素将后续的页脚元素向下推，具体取决于它的高度。您必须在元素中嵌入页脚，或者采取不同的方法。

于 2010-03-06T18:36:52.350 回答
1

在您的.iceabtsidecss 类中，您将位置定义为绝对位置。因此，页脚 div 不“知道”iceabtside div 的位置并将其定位在其以前的相对 div 之后，即使您的 iceabtside div 在同一个位置。

于 2010-03-06T18:52:43.570 回答
0

好吧，相对位置将元素的位置设置为相对于它在文档中最初分配的位置的许多像素。将 top 和 left 都设置为 0 根本不会移动元素。例如，如果将 top 设置为 10，它会将元素从分配的位置向下移动 10 个像素。或者，如果您将 right 设置为 50，它会将元素从该位置向左移动 50 个像素。请注意，相对定位的元素不会导致其周围的任何元素重新定位，它只会与任何类似于绝对定位的元素重叠。

您的“iceabtside”课程似乎毫无价值。首先，您不需要将分区声明为块，因为默认情况下就是这样，并且将高度声明为自动也是默认设置，它会根据其中的内容自动调整高度。似乎您需要做的是摆脱所有定位的东西，只需在其上设置边距以将其放在页面中间或您想要做的任何事情。这样，页脚元素也会像你想要的那样出现在所有内容之后。

于 2010-03-06T18:37:29.780 回答