“绝对定位”项目垂直移动布局

我最近想出了如何使用绝对位置垂直对齐项目，并且它工作得很好，直到我今天做了一些事情。我正在修改我的布局，以便它能够流畅并以不同的屏幕分辨率工作，现在该项目正在向上移动并覆盖现有的布局项目，远远超出了其包含div的范围（是否有办法阻止这种情况发生？）。我知道这是因为它是“绝对定位”，我读过它从网站的流程中移除它，但有没有办法将这个项目保存在它所包含的div中？它正在向上移动，因为当屏幕缩小时，内容会被挤压在一起，并推动所有内容。“绝对定位”项目垂直移动布局

这让我感到特别疯狂，因为我很确定在调整大小之前它已经工作得很好，而且我认为我搞砸了一些东西并毁了它。我如何使这个绝对位置的东西行为？

来源

2015-04-03 Shirley Dodson

设置项目的父元素的定位是relative。绝对定位的元素只相对于他们最近的绝对或相对定位的父亲。

然而，有可能是一个更好的方式来实现你会比使用绝对定位的垂直对齐......

来源

2015-04-03 02:25:50 embden

父元素已经设置为相对的，我不得不为了让它工作而战。您是否有其他方法来垂直定位底部的东西？ – 2015-04-03 22:42:22

你能举一个你想要做的例子吗？ – embden 2015-04-04 16:19:40

这里是[链接]（http://jsfiddle.net/tcfnvtvq/），我基本上试图做。我不明白为什么data2和data3不是应该浮动的，因为它们是在我自己的代码中执行的，但是我的主要问题是将data1（和img，如果可能的话）放在TD的底部而不使用绝对位置，因为这两个高度都没有设置，并且它不断让我的布局搞乱。 @embden – 2015-04-05 17:36:21

您可以尝试与z-index属性弹，但它取决于你的布局

来源

2015-04-03 02:02:23 gia

这可能会帮助该项目在导航栏中它的阻止面前表现出来，但我想它不会突破它包含div。我不明白为什么它不这样做。为什么整个布局不像正常情况那样向下移动页面？ – 2015-04-03 22:43:29

绝对不会像平常一样向下移动，发布你的html + css，如果你想要更好的答案 – gia 2015-04-04 00:05:40

谢谢，但我已经决定不让我的项目像我想要的那样排列在底部。这些项目没有设置高度，所以我无法围绕绝对位置从布局流程中移除这一事实进行设计，似乎也没有人会将其他想法用于垂直对齐元素底部的东西。好吧。 – 2015-04-04 14:31:27

“绝对定位”项目垂直移动布局

回答

相关问题