我需要在窗口的中心放置一个div(with position:absolute;)元素.但我这样做有问题,因为宽度未知.
我试过这个.但需要根据宽度的响应进行调整.
.center {
left: 50%;
bottom:5px;
}
Run Code Online (Sandbox Code Playgroud)
有任何想法吗?
我有一个问题集中在属性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;
}Run Code Online (Sandbox Code Playgroud)
<body>
<div id="slideshowWrapper">
<ul id="slideshow">
<li><img src="img/dummy1.JPG" alt="Dummy 1" /></li>
<li><img src="img/piano_unlicened.JPG" alt="Dummy 2" /></li>
</ul>
</div>
</body>Run Code Online (Sandbox Code Playgroud)
我正在尝试修复它,div所以它总是粘在屏幕的顶部,使用:
position: fixed;
top: 0px;
right: 0px;
Run Code Online (Sandbox Code Playgroud)
但是,div它位于一个居中的容器内.当我使用position:fixed它时,修复了div浏览器窗口的相对位置,例如它在浏览器的右侧.相反,它应该相对于容器固定.
我知道position:absolute可以用来修复相对于它的元素div,但是当你向下滚动页面时,元素会消失,并且不会像上一样粘在顶部position:fixed.
是否有实现此目的的黑客或解决方法?
我想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;
}Run Code Online (Sandbox Code Playgroud)
<div class="jqbox_innerhtml">
This should be inside a horizontally
and vertically centered box.
</div>Run Code Online (Sandbox Code Playgroud)
如何使用CSS将此框置于屏幕中心?
请查看该链接,我想要相反:当内容溢出到滚动条时,我希望我的页脚始终位于页面的完整底部,如Stack Overflow.
我有一个div id="footer"和这个CSS:
#footer {
position: absolute;
bottom: 30px;
width: 100%;
}
Run Code Online (Sandbox Code Playgroud)
但它所做的只是转到视口的底部,即使向下滚动也会停留在那里,因此它不再位于底部.
图片: 
对不起,如果不澄清,我不希望它被修复,只是因为它在所有内容的实际底部.
你如何使绝对定位元素尊重其父元素的填充?我希望内部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>
Run Code Online (Sandbox Code Playgroud)
我可以通过内部div的边缘来实现它,但我宁愿不必添加它.
我实际上有两个问题,但我们首先解决主要问题,因为我相信另一个问题更容易解决.
我在滚动的左侧有一个固定的位置div用于菜单.右侧是一个正确滚动的标准div.问题是,当浏览器视口太小而无法看到整个菜单时......没有办法让它滚动我可以找到(至少不用css).我尝试在css中使用不同的溢出,但没有任何东西使div滚动.包含菜单的div设置为min-height:100%和position:fixed ..我需要保留的两个属性.
包含菜单的div 位于另一个绝对定位且高度设置为100%的包装div内.
如果内容对于div来说太高,我怎么能让它垂直滚动?
这导致我另一个问题,我不想要滚动条显示..但我想我可能已经有了答案(只有它还没有工作,因为我不能让div滚动开始).
有解决方案吗 也许需要javascript?(我对此知之甚少)
以及导致问题的相关代码(因为在这里发布整个东西太长了):
.fixed-content {
min-height:100%;
position:fixed;
overflow-y:scroll;
overflow-x:hidden;
}
Run Code Online (Sandbox Code Playgroud)
还尝试添加高度:100%也只是为了看看是否是一个问题,但它也没有工作...也没有固定的高度,如600px.
我有一个移动网站,它通过位置固定在屏幕底部的div.一切都在iOS 5中正常工作(我在iPod Touch上测试),直到我在一个带有表单的页面上.当我点击输入字段并出现虚拟键盘时,我的div的固定位置突然丢失.只要键盘可见,div就会随页面滚动.单击完成以关闭键盘后,div将恢复到屏幕底部的位置并遵循位置:固定规则.
有没有其他人经历过这种行为?这是预期的吗?谢谢.
.offset([coordinates])method设置元素的坐标,但仅相对于文档.那么我如何设置元素的坐标但相对于父元素的坐标?
我发现该.position()方法只获得相对于父级的"top,left"值,但它没有设置任何值.
我试过了
$("#mydiv").css({top: 200, left: 200});
Run Code Online (Sandbox Code Playgroud)
但不起作用.