Side navigation
#1160 closed bug (wontfix)
Opened May 03, 2007 10:16PM UTC
Closed June 15, 2007 08:58PM UTC
Last modified March 15, 2012 01:19AM UTC
Dimensions: <body> with margin auto results in bogus values from offset() on IE
| Reported by: | mikeker | Owned by: | |
|---|---|---|---|
| Priority: | minor | Milestone: | 1.1.3 |
| Component: | plugin | Version: | 1.1.2 |
| Keywords: | dimensions | Cc: | |
| Blocked by: | Blocking: |
Description
Using the Dimensions plugin (v 1.0a) and jQuery (v1.1.2). On IE (6 or 7),
offset()doesn't take into account the margin on the
<body>tag when
margin: autois specified. Works as expected on FF2. Workaround is to insert wrapper div just inside the
<body>tags and put your
<body>styling there.
Example:
<script type='text/javascript'>
$( document ).ready( function () {
alert( $( '#test' ).offset().left );
});
</script>
...
<body style='width: 600px; margin: auto;'>
<p>
Lorem ipsum dolor sit amet, <a id='test' href='#'>massa</a> elit facilisis, enim sociis lacinia in dui fusce quam etc.etc.etc.
</p>
</body>
Attachments (0)
Change History (1)
Changed June 15, 2007 08:58PM UTC by comment:1
| description: | Using the Dimensions plugin (v 1.0a) and jQuery (v1.1.2). On IE (6 or 7), {{{offset()}}} doesn't take into account the margin on the {{{<body>}}} tag when {{{margin: auto}}} is specified. Works as expected on FF2. Workaround is to insert wrapper div just inside the {{{<body>}}} tags and put your {{{<body>}}} styling there.\ \ Example:\ \ {{{\ <script type='text/javascript'>\ $( document ).ready( function () {\ alert( $( '#test' ).offset().left );\ });\ </script>\ ...\ <body style='width: 600px; margin: auto;'>\ <p>\ Lorem ipsum dolor sit amet, <a id='test' href='#'>massa</a> elit facilisis, enim sociis lacinia in dui fusce quam etc.etc.etc.\ </p>\ </body>\ }}}\ → Using the Dimensions plugin (v 1.0a) and jQuery (v1.1.2). On IE (6 or 7), {{{offset()}}} doesn't take into account the margin on the {{{<body>}}} tag when {{{margin: auto}}} is specified. Works as expected on FF2. Workaround is to insert wrapper div just inside the {{{<body>}}} tags and put your {{{<body>}}} styling there. \ \ Example: \ \ {{{ \ <script type='text/javascript'> \ $( document ).ready( function () { \ alert( $( '#test' ).offset().left ); \ }); \ </script> \ ... \ <body style='width: 600px; margin: auto;'> \ <p> \ Lorem ipsum dolor sit amet, <a id='test' href='#'>massa</a> elit facilisis, enim sociis lacinia in dui fusce quam etc.etc.etc. \ </p> \ </body> \ }}} \ |
|---|---|
| resolution: | → wontfix |
| status: | new → closed |
Margins, borders and padding must be specified in pixel values for the calculations to be correct in IE. Unfortunately fixing IE in this manner would bring offset to a screeching halt in performance.