Questions tagged «css-position»

CSS中的“ position”属性允许您通过将元素的值设置为静态（默认设置），相对，绝对，固定或粘滞来控制页面上的位置。

25
如何居中“位置：绝对”元素
我在将属性position设置为的元素居中时遇到问题absolute。有谁知道为什么图像没有居中？ body { text-align: center; } #slideshowWrapper { margin-top: 50px; text-align: center; } ul#slideshow { list-style: none; position: relative; margin: auto; } ul#slideshow li { position: absolute; } ul#slideshow li img { border: 1px solid #ccc; padding: 4px; height: 450px; } <body> <div id="slideshowWrapper"> <ul id="slideshow"> <li><img src="img/dummy1.JPG" alt="Dummy 1" …
23
固定位置，但相对于容器
我正在尝试使用以下方法修复一个问题div，使其始终停留在屏幕顶部： position: fixed; top: 0px; right: 0px; 但是，那 div位于内部居中容器中。当我使用position:fixed它时，它div相对于浏览器窗口进行了修复，例如它靠在浏览器的右侧。相反，它应该相对于容器固定。 我知道 position:absolute可以用来相对于修复元素div，但是当您向下滚动页面时，该元素消失并且不会像那样粘在顶部position:fixed。 是否有破解或解决方法来实现这一目标？
16
居中位置：固定元素
我想制作一个position: fixed;以动态宽度和高度为中心的弹出框。我曾经margin: 5% auto;为此。没有position: fixed;它，则水平居中，但不能垂直居中。添加后position: fixed;，它甚至没有水平居中。 这是完整的设置： .jqbox_innerhtml { position: fixed; width: 500px; height: 200px; margin: 5% auto; padding: 10px; border: 5px solid #ccc; background-color: #fff; } <div class="jqbox_innerhtml"> This should be inside a horizontally and vertically centered box. </div> 运行代码段隐藏结果展开摘要 如何使用CSS在屏幕上将此框居中？
12
即使有滚动条，也使div始终保持在页面内容的底部
CSS将Div推到页面底部 请查看该链接，我希望得到相反的结果：当内容溢出到滚动条时，我希望页脚始终位于页面的整个底部，例如Stack Overflow。 我有一个div id="footer"和这个CSS： #footer { position: absolute; bottom: 30px; width: 100%; } 但是它所做的只是进入视口的底部，即使向下滚动也可以停留在视口的底部，因此它不再位于底部。 图片： 很抱歉，如果没有弄清楚，我不希望将其修复，仅因为它位于所有内容的实际底部即可。
20
“位置：粘性；” 无法正常工作的CSS和HTML
滚动到导航栏后，我想使其停留在顶部，但是它不起作用，我也不知道为什么。如果可以的话请帮我，这是我的HTML和CSS代码： .nav-selections { text-transform: uppercase; letter-spacing: 5px; font: 18px "lato",sans-serif; display: inline-block; text-decoration: none; color: white; padding: 18px; float: right; margin-left: 50px; transition: 1.5s; } .nav-selections:hover{ transition: 1.5s; color: black; } ul { background-color: #B79b58; overflow: auto; } li { list-style-type: none; } <nav style="position: sticky; position: -webkit-sticky;"> <ul align="left"> …
177 html  css  css-position 
8
绝对定位，忽略父填充
您如何使绝对定位元素遵守其父元素的填充？我想要一个内部div延伸其父对象的宽度，并定位在该父对象的底部，基本上是一个页脚。但是孩子必须尊重父母的内向，而这并不是在做。将孩子直接压在父母的边缘上。 所以我想要这个： 但我得到这个： <html> <body> <div style="background-color: blue; padding: 10px; position: relative; height: 100px;"> <div style="background-color: gray; position: absolute; left: 0px; right: 0px; bottom: 0px;">css sux</div> </div> </body> </html> 我可以在内部div周围留一个边距来实现它，但我不想不必添加它。
5
具有固定位置的div，如果内容溢出，则需要滚动
我实际上有两个问题，但是让我先解决主要问题，因为我认为另一个更容易解决。 我在菜单左侧的滚动条的左侧有一个固定位置的div。右侧是可以正确滚动的标准div。问题是，当浏览器的视口太小而看不到整个菜单时，无法找到我可以找到的滚动方式（至少没有使用CSS）。我试过在CSS中使用不同的溢出，但是没有什么可以使div滚动。包含菜单的div设置为min-height：100％和position：fixed ..这两个属性我都需要保留。 包含菜单的div 位于另一个包装div中，该div绝对定位并且高度设置为100％。 如果内容对于div而言太高，如何使其垂直滚动？ 这导致了另一个问题，即我不希望显示滚动条。.但是我想我可能已经对此有了一个答案（只是它不起作用，因为我无法使div滚动。首先）。 有什么办法吗？也许需要JavaScript？（我对此一无所知） JS小提琴示例 以及引起该问题的相关代码（由于将整个内容发布在这里太长了）： .fixed-content { min-height:100%; position:fixed; overflow-y:scroll; overflow-x:hidden; } 还尝试添加height：100％只是为了看看是否是一个问题，但是它也不起作用...也没有固定的高度，例如600px。
7
在jQuery中，如何设置元素的“顶部，左侧”属性的位置值相对于父级而不是相对于文档？
.offset([coordinates])方法设置元素的坐标，但仅相对于文档。那么如何设置元素的坐标，但相对于父元素呢？ 我发现该.position()方法仅获得相对于父级的“顶部，左侧”值，但未设置任何值。 我尝试过 $("#mydiv").css({top: 200, left: 200}); 但不起作用。
4
CSS：如何将position：absolute div放在一个position：relative div内，而不会被溢出：隐藏在容器中
我有3个级别div： （下面的绿色）div带有的顶层overflow: hidden。这是因为我希望如果该框内的某些内容（此处未显示）超出框的大小，则会对其进行裁剪。 （在下面红色）这里面，我也div有position: relative。唯一的用途是用于下一个级别。 （下面的蓝色）最后，div我从流程中取出，position: absolute但要相对于红色div（而不是页面）进行定位。 我希望将蓝色框从流程中移出并扩展到绿色框之外，但要相对于红色框定位，如下所示： 但是，使用下面的代码，我得到： 并移除position: relative红色框上的，现在允许蓝色框脱离绿色框，但不再相对于红色框定位： 有没有办法： 将保持overflow: hidden在绿色框上。 蓝色框是否已超出绿色框并相对于红色框定位？ 完整资料： #d1 { overflow: hidden; background: #efe; padding: 5px; width: 125px; } #d2 { position: relative; background: #fee; padding: 2px; width: 100px; height: 100px; } #d3 { position: absolute; top: 10px; background: #eef; padding: 2px; …
10
'transform3d'不适用于位置：固定子级
我在哪里，在正常情况下，CSS，固定股利将正好它被指定的（定位的情况下top:0px，left:0px）。 如果我的父母有一个translate3d转换，这似乎不被尊重。我没看到什么吗？我尝试了其他webkit转换，例如样式和转换原点选项，但没有运气。 我在JSFiddle上附加了一个示例，在该示例中，我希望黄色框位于页面的顶部，而不是容器元素的内部。 您可以在下面找到小提琴的简化版本： #outer { position:relative; -webkit-transform:translate3d(0px, 20px , 0px); height: 300px; border: 1px solid #5511FF; padding: 10px; background: rgba(100,180,250, .8); width: 80%; } #middle{ position:relative; border: 1px dotted #445511; height: 300px; padding: 5px; background: rgba(250,10,255, .6); } #inner { position: fixed; top: 0px; box-shadow: 3px 3px 3px #333; …
25
iOS 5固定位置和虚拟键盘
我有一个移动网站，该网站的div通过position：fixed固定在屏幕底部。在iOS 5（我正在iPod Touch上进行测试）中，所有方法都可以正常工作，直到出现带有表单的页面为止。当我点击输入字段并出现虚拟键盘时，突然我的div的固定位置丢失了。现在，只要可见键盘，div就会随页面滚动。单击“完成”以关闭键盘后，div将恢复到其在屏幕底部的位置，并遵守position：fixed规则。 有没有其他人经历过这种行为？这是预期的吗？谢谢。
3
当位置：绝对时，如何删除Left属性？
选择特定语言后，我会将网站CSS覆盖为RTL版本。 我有一个必须绝对定位的元素。在LTR版本中，我这样做left: 0px;并且它与左侧对齐；在RTL版本中，我想对进行相反的操作right，但是该left属性没有被覆盖，因此它仍然保留在左侧。 我曾尝试使用进行黑客入侵!important，但这没有用。 我尝试设置left: none，但是没有用。 如何设置为无或覆盖时将其完全删除？
137 css  css-position 
4
位置绝对和溢出隐藏
我们有两个DIV，一个嵌入另一个。如果外部DIV的位置不是绝对的，则内部DIV的位置绝对不遵循外部DIV的隐藏溢出（示例）。 是否有机会使内部DIV服从外部DIV的隐藏溢出，而无需将外部DIV设置为绝对位置（因为这会破坏我们的完整布局）？相对于内部DIV的相对位置也不是一种选择，因为我们需要“增长”到表TD（exmple）。 还有其他选择吗？
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.