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.

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

Not vertically centered properly with <!DOCTYPE html> set #4

Closed
karimhossenbux opened this issue Mar 27, 2017 · 2 comments
Closed

Not vertically centered properly with <!DOCTYPE html> set #4

karimhossenbux opened this issue Mar 27, 2017 · 2 comments

Comments

@karimhossenbux
Copy link

Found a bug when having doctype declared.

I was losing my mind to find why it wasn't working!

When the doctype is set, document.body.clientHeight returns a bigger value than expected, the same height as the body instead of the height of the actual viewport.

Maybe the solution here is to replace document.body.clientHeightwith document.documentElement.clientHeight ?

@francoischalifour
Copy link
Owner

Thanks for opening the issue.

Since, as you pointed out, document.body.clientWidth doesn't work as expected when the doctype is declared, a simpler solution would be to directly replace document.body.clientHeight in favor of window.innerHeight (document.documentElement.clientHeight doesn't work when the doctype is not declared):

-const windowWidth = document.body.clientWidth || window.innerWidth
-const windowHeight = document.body.clientHeight || window.innerHeight
+const windowWidth = window.innerWidth
+const windowHeight = window.innerHeight

This way, it would work with or without the doctype declared.

What do you think?

@karimhossenbux
Copy link
Author

Yes sure, if that works in both case, that's better!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants