什么是定位祖先?
我正在阅读文章在MDN上.它谈到“可以将绝对定位元素固定到相对于其最近定位的祖先元素的位置". 我对“定位祖先"的理解是具有除静态以外的任何位置属性的祖先.但是我需要专家的意见来验证我的想法. 解决方案 在指代 positioned祖先时，我们指的是最接近祖先的元素，该元素具有设置的 position 值，不是 static (默认). 所以这里有两个假设: 如果有多个已
..
css-position相关内容
背景滤镜:模糊不适用于绝对位置元素
我正在尝试使用background-filter:blur制作具有玻璃效果的工具提示，只是该滤镜似乎无法在绝对位置上起作用.我想这是因为该项目已经超出了文档流程，所以无法识别背景，但是可能有解决该问题的方法. 图像:过滤器不会作用于绝对位置的元素 解决方案 我可以给您一个由用户在堆栈溢出中给出的示例.我在下面给出了示例代码，希望对您有所帮助: CSS: body，main
..
Div在移动浏览器中的绝对位置问题
我在以下网站上绝对定位名为id ="verticalGenesis"的div时遇到很多问题: http:在移动浏览器中//genesispetaluma.com/index.html ，包括iPhone上的Safari和Chrome.理想情况下，我尝试使用以下CSS将徽标放置在屏幕的右侧: #verticalGenesis {背景图片:url("../img/Genesis％20Text.gi
..
对象拟合，对象定位和绝对定位
在尝试使图像适合矩形时，我遇到了一个奇怪的问题，想知道是否有人知道这三种使用对象适合度的行为方式为何不同: .container {宽度:250像素；顶部填充:20％；边框:1px纯红色；职位:相对显示:行内块}.container> img {位置:绝对；最高:0;左:0；适合对象:包含；对象位置:中心中心；}.图像 {宽度:100％;高度:100％;}.image-1 {正确:0；底部
..
CSS轮廓宽度不起作用
我正在尝试将输入元素的轮廓宽度设置为焦点.不管我的设置如何，轮廓宽度都保持不变(就像默认设置一样，无法更改). 这是代码笔中的示例 这是css的一部分，我试图设置焦点的轮廓宽度: input:focus {轮廓宽度:0.1px;轮廓颜色:#725b44;} 编辑: 我只是忘了包含线条样式(实线，点线...).现在可以了.一件事对我来说仍然很奇怪.为什么轮廓在元素内?不是将
..
将导航栏移到媒体查询的右侧
我正在尝试在浏览器窗口达到某个大小时将导航栏移动到右侧的固定位置，并在其小于该大小时将其放在顶部.使用下面的代码(如jsfiddle中所示)，当我调整html大小时，导航栏在左侧(而不是右侧)对齐. 问题，如何将导航栏移动到媒体查询屏幕的右侧.根据我在SO上发现的几个问题，使用 position应该足够了:fixed;最高:50％;right:0; ，但无法正常工作. (请注意，如果要
..
将div附加到另一个div的右侧
我有一个像容器一样的div，它的内部有2张图片.一幅图像位于div的左侧，另一幅图像位于div的右侧.我的容器是Bootstrap的容器 它们两个都用div包裹，并且 div的位置是固定的. 我的问题是我无法找到要附加到着色器右侧的正确图像.我尝试了 float 和 right 属性，但是它们没有给出预期的结果. 如何将div附加到另一个div的右侧? 解决方案 http
..
带有转换的绝对定位元素的间距为1px:仅在Safari上翻译
有一个全宽容器，其中包含位于容器内部居中的内部框.盒子内部有一个100％宽度的绝对定位盒子.在该框上还应用了transform:translate(). HTML:
CSS: .cover
..
何时准确使用相对位置
我不是CSS方面的专家.我没有给任何职位，并且有css之类的 #myId {左边距:10px;边距顶部:10像素;}#我的身份{职位:相对左:10px；顶部:10px；} 两者都完全符合我的要求.我什么时候应该准确地使用相对位置.与其他相比有什么优势或劣势吗? 解决方案 案例1 您具有位于 absolute 内的内部元素，并希望该元素坚持其父元素.比您将 position:r
..
如何启用CSS位置:在移动浏览器中处于粘滞状态?
向我的网页添加了一些 position:sticky 属性.在桌面浏览器上可以正常工作，但会吸引手机. Chrome和Safari for iOS的 解决方案 sticky 属性需要首先通过 -webkit 供应商设置: .element {位置:-webkit-sticky;位置:粘性；} 您可以在 canIUse 中查看有关浏览器兼容性的信息
..
CSS“位置:固定":移动缩放
我正在尝试在移动浏览器上解决css"position:fixed"属性的问题.我有一个固定的div:
...这里的其他内容... 使用CSS: #logo {位置:固定；-webkit-backface-visibility:隐藏；底部:100px；右:0px；宽度:32px；高度:32px；} 因此，通常行为恰好是所需的行为，div位置
..
在Chrome中编辑粘性输入元素会导致页面滚动到顶部
当我发现其中包含输入字段或文本区域之类的可编辑元素会触发页面滚动到顶部时，我试图在我的一个个人项目中使用css position:sticky 如果可能的话，我真的很想删除此行为. .container {高度:5000像素；}.标题{背景:#ccc;高度:50px；行高:50px；边距顶部:10像素;font-size:30px;padding-left:10px;位置:-webk
..
宽度:100％位置:绝对
如果您这样做: test 您将获得一个div，该div被拉伸以填充整个屏幕宽度(100％).这就是我需要做的. 但是，我还需要设置起始位置.因此，我需要 position:absolute . 当我添加position:absolute时， div 的宽度仅与其中内容的宽度一样(类似于浮点数).有没有办法
..
为什么此绝对定位的元素相对于其容器未定位?
我有这个简单的代码，可以并排放置两个 div #container 元素.在每个这些子目录中，我都想相对于其父项( div #container )定位一个子项 div #child . .容器 {向左飘浮;右边距:10px；}.孩子 {位置:绝对；左:0.2ex;}
a
..
为什么内联块元素的边距会影响同级内联块元素
我不知道为什么 元素(在 margin-top > element)影响 margin-top 或 的位置.通过向 元素添加顶部边距， 元素也向下移动，就好像它也具有 top-margin 应用于它 标题{职位:相对显示:inline-block;边框:1px实线#333；}标题hgroup {显示:inline-
..
position:相对有用的是什么?
我今天正在考虑CSS定位模式，意识到除了将 position:absolute 用于子元素之外，我从来没有将 position:relative 用于其他任何用途. 我更像是一个“开发人员"，而不是“设计师"，但是这些年来，我已经做了很多基于CSS的布局.我曾经使用过表格，浮点数，边距(正数和负数)，position:absolute甚至position:fixed，但是我认为我从来没有使用
..
CSS位置:固定不带顶部会产生意想不到的布局?
固定div
非固定div非固定div非固定div
..
z-index如何使用其默认值?
谁能解释一下此代码段中z-index默认值的工作原理 ul {list-style-type:无；填充:0;边距:0;宽度:150像素；}li {职位:相对}li ul {位置:绝对；背景:绿色；左:20％；边框:1px实线；}.foo {背景:红色；}
..
CSS位置-前100％不等于前0
当我为CSS3动画的元素分配 fixed 位置时，我注意到了这一点， top:100％的效果与 bottom相同:0; .它位于文档之外的元素中，而 bottom:0; 仍显示整个元素. JSFIDDLE DEMO css位置 top:0; 的对立面是否会自动产生与 bottom:0; 相同的效果? 解决方案 这是因为 top 值将顶部边缘作为参考点，因此需要使用 transf
..
相对于相对父元素的CSS位置绝对值
在我的CSS技能更新过程中，我经历了一些过时的事情，特别是z-index，我注意到一些奇怪的东西，或者可能存在某种情况 示例: http://jsfiddle.net/mEpgR/ 元素div1的父对象是cont，我已经将div1的position属性设置为绝对值，但是当我移动它时，它相对于其父对象移动.我的印象是，设置为绝对定位的项是外部常规流，并且仅相对于作为其父项的浏览器端口移动
..