通常我会通过将margin设置为auto,使用position:absolute或通过填充来完成此操作,但不幸的是这些操作在这种情况下不起作用。我需要一个div从页面水平偏离中心大约15个像素。棘手的一点是,随着页面变宽,它需要正确缩放。在我看来,我需要根据中心点进行水平调整,而不是左侧。我怎么能做到这一点?谢谢。将div稍微偏离中心
4
A
回答
3
使用一个容器div,它是居中的,然后你的内容可以用gi已经margin-left:npx
- 像这样:
HTML
<div id="container">
<span id="green"> </span><br />
<span id="blue"> </span>
</div>
CSS
#container{width:100px; margin:auto auto; background-color:red;}
#container span{display:block; width:100%; }
#green{background-color:green; margin-left:10px;}
#blue{background-color:blue; margin-left:-10px;}
看到例如编写了这里 - http://jsfiddle.net/Xpk8A/1/
0
给出一个包装: margin:auto; position:absolute;
内包装,放div: 位置:相对; left:-15px; (或任何你想要的)
示例页面将有所帮助。
0
您可以绝对定位您的div
并将left
属性设置为50%。然后,将margin-left
设置为50%+ 5px(无论如何)。但是,如果你在盒子上有一个固定的宽度,这只会起作用。例如,如果该框宽200px,则margin-left
将是-115px
。
0
,关键是要设置width:100%
和固定margin
,你可以在我的例子见下文
<style>
div {
background-color:red;
height:100px;
margin:0 auto;
width:100%;
margin-left:15px;
}
</style>
<div></div>
0
<html>
<body>
<div class="centered">
<div class="offcenter">
</div>
</div>
</body>
</html>
的CSS将是:
.centered
{
margin: 0 auto;
width:300px;
height:200px;
background-color:red;
}
.offcenter
{
background-color:blue;
width:285px;
height:inherit;
float:right;
}
0
可以使用display:inline-block
为center
的DIV
然后给你的margin
它。
像这样:
.Parent{text-align:center;}
.Child{
display:inline-block;
text-align:left;
width:200px;
height:150px;
background:red;
margin-left:15px;
}
检查这个小提琴http://jsfiddle.net/Xpk8A/2/
删除margin-left:15px
然后点击Run
按钮,在小提琴看到不同的。
相关问题
- 1. CSS垂直对齐稍微偏离
- 2. EditText显示文字稍微偏离?
- 3. 问题用2 DIV稍微偏移
- 4. 视口在全屏中似乎稍微偏离屏幕
- 5. UINavigationBar偏离中心?
- 6. ReSharper的9.0造型:BSD缩进稍微偏离
- 7. d3 js时间轴稍微偏离/倾斜/移动
- 8. 允许用户登录,即使密码稍微偏离
- 9. 间距在我的输出稍微偏离用C
- 10. JavaScript的算法插入排序稍微偏离
- 11. 定位在IE7稍微偏离(像10px顶部和右侧)
- 12. BasicStroke导致偏离中心
- 13. glScalef命令偏离中心
- 14. 我如何使偏心位置偏离?
- 15. Kinect v2红外传感器和RGB图像的对齐总是稍微偏离
- 16. iframe中的GMap偏离中心
- 17. 如果其中一个Web服务器的时钟稍微偏离,将会缓存吗?
- 18. 具有自动保证金的HTML CSS div div内偏离中心?
- 19. CSS:文本颜色在Safari/Firefox中稍微偏移
- 20. 谷歌地图标记偏离中心
- 21. 谷歌地图偏离中心/切断
- 22. 列表显示略偏离中心
- 23. prettyplotlib标签和注释偏离中心
- 24. intent.putExtra(Intent.EXTRA_SHORTCUT_ICON,bmp)图像偏离中心
- 25. 第一个元素是偏离中心
- 26. 显示Google地图偏离中心
- 27. BXSlider偏离中心的图像
- 28. 当渲染为FBO纹理时纹理坐标稍微偏移
- 29. 表格单元格文本稍微与中心左侧对齐
- 30. CSS中心问题 - Div中心appx 15px太偏右
通过正确缩放你的意思是它必须与主格一起移动?或者您希望它(字面上)缩放,例如:如果屏幕为800px,则空间为15px,如果是1200,则为22px? – Yisela