Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

outerHeight() differs between chrome and IE11 #3698

Closed
nick1377 opened this issue Jun 16, 2017 · 8 comments · Fixed by #3738
Closed

outerHeight() differs between chrome and IE11 #3698

nick1377 opened this issue Jun 16, 2017 · 8 comments · Fixed by #3738
Assignees
@gibson042
Labels
Bug Dimensions Has Pull Request
Milestone
3.3.0

Comments

@nick1377
Copy link

nick1377 commented Jun 16, 2017 •
edited

Description

The outerHeight() differs between Chrome and IE11.
In the test case below the height shows as 23 in chrome but 25 in IE11.

Link to test case

https://jsfiddle.net/179d0uek/12/
@timmywil
Copy link
Member

Thanks for opening an issue. But, the result is correct because you have a border on both the outer div and inner div, so it's really 10 + 2 + 2 = 14.

@nick1377 nick1377 changed the title outerHeight() returns wrong result when height is "auto" and has a border outerHeight() counts borders twice in IE11 when height is "auto" Jun 19, 2017
@nick1377
Copy link
Author

nick1377 commented Jun 19, 2017 •
edited

Can you reopen this issue? The test case was bad and I had the issue slightly wrong but it is a bug. I provided a better test case and fixed the title and description a bit.

@dmethvin
Copy link
Member

Please work the test case down to a minimum, removing css and HTML elements/attributes that don't affect the result.

@nick1377
Copy link
Author

Done. The new test case is now only what is needed to reproduce the issue.

@nick1377 nick1377 changed the title outerHeight() counts borders twice in IE11 when height is "auto" outerHeight() differs between chrome and IE11 Jun 19, 2017
@mgol
Copy link
Member

mgol commented Jun 19, 2017

Thanks for the updated test case. I confirm the behavior in IE changed in jQuery 3.2.0.

@mgol mgol reopened this Jun 19, 2017
@dmethvin
Copy link
Member

dmethvin commented Jun 20, 2017 •
edited

Here's what I see in the IE11 inspector:
image
Notice the offset 2, I assume that's coming from the default stylesheet and if you add cellpadding=0 cellspacing=0 to the <table> it goes away. There's no guarantee that all browsers will have the same default stylesheet and even if they did it's possible the measurements might be different due to things like font substitution.

@mgol
Copy link
Member

mgol commented Jun 20, 2017

@dmethvin The biggest issue is that behavior in IE changed in jQuery 3.2.0 so it looks like an unintended breaking change.

@gibson042
Copy link
Member

The problem seems to hinge on phantom <tr> borders in IE: https://jsfiddle.net/179d0uek/15/ . Now to investigate the reason...

@gibson042 gibson042 self-assigned this Jul 27, 2017
gibson042 added a commit to gibson042/jquery that referenced this issue Jul 27, 2017
@gibson042
Dimensions: Add test for jquerygh-3698
6132c21
gibson042 added a commit to gibson042/jquery that referenced this issue Jul 27, 2017
@gibson042
Dimensions: Treat offsetWidth/offsetHeight at border-box getters
57d87e3 
Fixes jquerygh-3698
gibson042 added a commit to gibson042/jquery that referenced this issue Jul 27, 2017
@gibson042
Dimensions: Treat offsetWidth/offsetHeight as border-box getters
bb6fd2b 
Fixes jquerygh-3698
@gibson042 gibson042 mentioned this issue Jul 27, 2017
Merged
4 tasks
@timmywil timmywil added this to the 3.3.0 milestone Jul 31, 2017
gibson042 added a commit that referenced this issue Jul 31, 2017
@gibson042
Dimensions: Improve offsetWidth/offsetHeight fallback
a495784 
Fixes gh-3698
Fixes gh-3602
Closes gh-3738
@nightskylark nightskylark mentioned this issue Apr 18, 2018
Closed
@lock lock bot locked as resolved and limited conversation to collaborators Jun 17, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@gibson042 gibson042

Labels
Bug Dimensions Has Pull Request
Milestone
3.3.0
Development

Successfully merging a pull request may close this issue.

Dimensions: Improve offsetWidth/offsetHeight fallback gibson042/jquery
5 participants
@dmethvin @timmywil @gibson042 @mgol @nick1377