Internet Explorer box model - what is offset?

你说的曾经没有我的故事 提交于 2019-11-30 08:07:12

The offset is the distance at which the element was moved from its original location. This is seen when you position an element either relative or absolute with left, top, bottom and/or right values. Take the following code as an example:

#header {
    top: 3em;
    left: 3em;
    position: relative;
}

If we inspect this element in Internet Explorer 10, we see the offset you were mentioning. The em values have been converted to pixels, but the effect is still visible. Note that we see something similar in the Chrome Developer Tools (also in Opera), only it's labeled as "position" instead:

Oddly enough, Firefox doesn't even appear to communicate the offset/position via their illustration:

In the end this is an issue of mere semantics. Whether we call it "offset" or "position," it's still the same thing; it's the distance from its original location on the screen.

Hope this helps.

This seems weird, but you can try setting vertical-align: top in the CSS for the inputs. That fixes it in IE8, at least.

I had similar issue, my header menu width was not appearing correctly (was appearing in shrunk width), after some debugging I realized that I have added rem Poly-fill that was creating problem for me. I was using meta(http-equiv="x-ua-compatible" content="IE=Edge,chrome=1") too.

After removing rem-polyfil JS file, it started working correctly for me.

You can try to use: position: -ms-device-fixed; this trick helps me.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!