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

clientWidth clientHeight offsetWidth offsetHeight cause block to be raised unexpectedly #7236

Closed
shaozi opened this issue Feb 9, 2022 · 2 comments

Comments

@shaozi
Copy link

shaozi commented Feb 9, 2022

Describe the bug

Adding any of
bind:clientWidth
clientHeight
offsetWidth
offsetHeight
to a div cause it to be raised above other blocks.

Reproduction

See this REPL:

https://svelte.dev/repl/a74a224404d1495c8c08d36da06890a0?version=3.46.4

It uses margin-top: -75px to put the second div on top of the first div. But after apply bind:clientHeight to the first div, it goes to the top and covers the second div.

Logs

No response

System Info

latest REPL

Severity

annoyance

@Prinzhorn
Copy link
Contributor

Prinzhorn commented Feb 9, 2022

The iframe hack to measure the size adds position: relative. A workaround would be to add an additional wrapper element (or manually mess with z-index). Until ResizeObserver is implemented to replace the current solution.

Another one for the collection

#4233
#6127
#6708
#7099
#5963

@Rich-Harris
Copy link
Member

Svelte 5 uses resize observers here, and as such I'll close this issue

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

No branches or pull requests

3 participants