问题标签 [positioning]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
7 回答
126269 浏览

css - 如何将图像水平居中并将其与容器底部对齐?

如何将图像水平居中并同时与容器底部对齐?

我已经能够自行将图像水平居中。我还能够自行对齐容器的底部。但我无法同时做到这两点。

这是我所拥有的:

该代码将图像与 div 的底部对齐。我需要添加/更改什么才能使其在 div 内水平居中图像?图像尺寸事先不知道,但它会是 175x175 或更小。

0 投票
7 回答
19547 浏览

javascript - 什么会使 offsetParent 为空?

我正在尝试在 JavaScript 中进行定位。我正在使用基于经典 quirksmode 函数的累积位置函数,该函数对每个函数求和offsetTop,直到顶部节点。offsetLeftoffsetParent

但是,我遇到了一个问题,我感兴趣的元素offsetParent在 Firefox 中没有。在 IEoffsetParent中存在,但offsetTop总和offsetLeft为 0,因此在效果上与 Firefox 中存在相同的问题。

什么会导致在屏幕上清晰可见且可用的元素没有offsetParent? 或者,更实际地,我怎样才能找到这个元素的位置以便在它下面放置一个下拉菜单?

编辑:以下是如何重现此特定实例的方法(当前接受的答案未解决):

  1. 打开Stack Overflow 的主页
  2. 在 Web 浏览器(例如 Chromev21)的控制台中运行以下代码:

    /li>

为什么是offsetParent那个元素null

0 投票
3 回答
686 浏览

html - IE 将左侧边栏置于内容下方

我不熟悉这个网站,但我正在拼命寻求我正在建立的网站的帮助。如果我没有在正确的地方或错误地问我的问题,我很抱歉,所以如果我做错了,请告诉我!

我建立了一个简单的网站,由四个页面(index.html 加上其他三个页面)组成。在 FF 中似乎一切正常,但在 IE 中却不行。我知道有很多类似的问题,但经过数小时的搜索,我找不到解决方案。我在左侧有一个侧边栏,它在 FF 中出现在适当的位置,但在 IE 中出现在内容下方。奇怪的是,它在第​​四页上确实有效,所以我不知道这是我帐户上的 css 还是 html 错误。目前该网站位于http://www.kids2move.nl/djctapas

我希望有人能看到我做错了什么以及如何解决它。我会定期检查此页面,以便在需要时添加其他信息,例如我的 css 文件或 htmlcode。提前致谢!!

0 投票
1 回答
6227 浏览

css - Div 背景不与 Div 定位

我有几个我使用类和 ID 设置样式的 Div,他 div 本身是空的,因为它们只是其背景的占位符。示例分区:

然后我使用这个 css 为它们设置样式:

只要 Div 位于文档的左上角,图像就会正确显示,但是当 Div 放置在页面上的其他位置时,图像会保持(不可见)在页面的左上角,仅显示与div(在示例中,这将是图像的底部)。

编辑 我试图在不影响我的其他布局的情况下定位这些 Div,它们位于其他布局的后面。除了背景图像不跟随 divs 位置这一事实之外,这有效。
所以基本上我的问题是,为什么 ranImg1 div 定位的背景不是 div 而是留在左上角,以及如何解决这个问题?

0 投票
3 回答
376 浏览

html - 定位标志和导航链接不对齐

问题截图:

http://i36.tinypic.com/dfxdmd.jpg

黄色块是徽标,蓝色框是导航链接(我已将它们消隐)。我想对齐底部的链接,使它们粘在正文内容的顶部(白框)。我该怎么做?这是相关的CSS和HTML。

提前致谢。

0 投票
4 回答
28161 浏览

html - html元素忽略CSS左+右属性?

我注意到<input>HTML 中的元素忽略了 CSS 对“left”和“right”属性。对“顶部”和“底部”也是如此。请参阅下面的示例代码:

应该占据浏览器中的<input>几乎所有空间(除了它周围的 10px 边框)。它在 Safari 中运行良好,但在 FireFox 和 IE 中,它<input>在浏览器的左上角仍然很小。

如果我使用“left”和“width”,以及“top”和“height”,那么一切正常。但是我不知道宽度和高度是多少,我希望它们根据浏览器窗口的大小进行调整。

任何想法如何解决这个问题?

谢谢。

0 投票
2 回答
1049 浏览

css - IE 不自动调整绝对定位元素的宽度

当我在其中的任何元素的样式中指定 aheight时,IE 使整个事物的宽度为 100%,而不是使其宽度保持“自动调整大小”。

其他浏览器显示它很好,但不是 IE。我该如何解决?

谢谢!

0 投票
3 回答
4680 浏览

javascript - Position div depending on distance browser edge (javascript)

I am trying to create a small tooltip script that mostly relies on css. The bit of JavaScript I can't figure out is how to position the div based on its distance to the browsers edge.

When the div appears I would like it to check how close it is to the top, bottom, left and right. For example if there is not enough space to display the div above the tooltip link it should position it below the link.

Essentially I would like the div to be "aware" of its position and know where to go to make sure it is visible.

Thanks

0 投票
3 回答
498 浏览

html - 定位副标题内容而不影响另一个 HTML 列表

我正在制作一个带有标题和副标题的列表。我的主要列表 Home1 后面是一个副标题。如何在不影响另一个列表的情况下准确定位子标题内容?

0 投票
8 回答
32480 浏览

css - CSS 同行对齐

有没有一种优雅的方法可以将 3 个元素左、中、右对齐在同一行上?

现在我正在使用 3<div>的宽度:33%;float:left; 而且效果不太好。