元素顶部相对于父母的底部

时间:2016-03-04 07:51:26

标签: html css web position

我有两个div:一个在另一个之上(我将调用顶部的一个topDiv而另一个bottomDiv),它们每个都有一个width 100%。它们位于名为div的另一个parent内。 parent充当虚拟/容器,其主要目的是帮助定位topDivbottomDiv。这些div中的每一个都使用绝对定位。 bottom具有固定的高度,因此我将bottom css属性topDiv设置为此高度。但是,top我没有bottomDiv css属性,因为我认为它会直接位于topDiv下,但事实并非如此。

所有方向属性(toprightbottomleft)都是从他们命名的方向衡量的(例如top来自顶部,所以如果指定5em之类的东西,那么元素放置在离容器顶部5em的位置),但有没有办法扭转效果?例如,指定right的金额,该金额会导致元素放置在远离其容器的 left 而不是 right 的指定金额。< / p>

1 个答案:

答案 0 :(得分:0)

由于(function(){ document.addEventListener("click", function(){ var ul = document.querySelector("#band-list"), lis = ul.querySelectorAll("li"), length = lis.length, multiDimensionalArray = []; for(var i = 0; i < length; i++){ multiDimensionalArray.push( [ parseInt(lis[i].getAttribute("data-band-id")), parseInt(lis[i].getAttribute("data-order")) ]); } console.log(JSON.stringify(multiDimensionalArray)); }); })(); 属性定义了与父母top的距离,然后使用top,这意味着&#34;与父母的距离top:100% 1}}等于父&#39; s top&#34; ,您将元素置于其父母的最底层。

现在,如果你想让你的元素达到顶峰,例如,从父母底部获得5px,你可以使用height

calc