div的相对定位

时间:2011-05-03 11:35:01

标签: html css css-position

基本上,我有一个表单,在我页面上的这个随机空间中的那个表单之外我想要一个div(包含两个按钮)。我看过使用绝对定位。但是,它将它定位在页面包装器之外。

如何从实际页面的角点而不是窗口获取定位?

5 个答案:

答案 0 :(得分:3)

  

我怎样才能获得定位   从角点指定   实际页面而不是窗口?

您需要将position: relative添加到您希望偏移topleft值的元素中。

这可能是您的form,也可能是您的#container / #wrapper元素。

请参阅此处了解详情和视觉效果:http://css-tricks.com/absolute-positioning-inside-relative-positioning/

答案 1 :(得分:1)

现在看来你已经得到了答案。但无论如何都要发帖。

一个简单的简短示例,显示如何完成与父级的相对定位。

http://jsfiddle.net/EadXw/

答案 2 :(得分:0)

如果您希望它在页面上放置top:0;left:0,请将其放在<body>标记后面。

如果包装在任何东西中,容器可能会改变它的位置。确保它是独立的,不受任何容器的影响。

答案 3 :(得分:0)

听起来你应该读一下DOM的流程。

Positioning with CSS and HTML

答案 4 :(得分:0)

确保您的<form>元素包裹整个“页面”,并且带有按钮的<div><form>的第一个孩子。

执行此操作后,您可以将规则position:relative添加到表单,将position:absolute添加到<div>,然后使用topleft移动它。

另一种选择是在表单上没有排名规则,position:relative上有<div>。这与iPad和iPhone设备更加兼容,它们不喜欢绝对定位。当您采用这种方法时,请确保height的{​​{1}}和相同大小的<div>margin-bottom