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

gatsby-announcer div introduced in v2.18.25 #20728

Closed
t2ca opened this issue Jan 20, 2020 · 2 comments · Fixed by #20781
Closed

gatsby-announcer div introduced in v2.18.25 #20728

t2ca opened this issue Jan 20, 2020 · 2 comments · Fixed by #20781
Assignees
@madalynrose
Labels
type: bug An issue or pull request relating to a bug in Gatsby

Comments

@t2ca
Copy link
Contributor

t2ca commented Jan 20, 2020 •
edited
Loading

Since upgrading to gatsby@2.18.25, the code bellow is added to the bottom of the page.

<div id="gatsby-announcer" role="alert" aria-live="assertive" aria-atomic="true" style="position: absolute; width: 1px; height: 1px; padding: 0px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px;"></div>

This adds a 1px line to the bottom of the page.

Going back to gatsby@2.18.24 will fix this problem.

edit:

This issue was fixed in gatsby@2.19.3

#20697
@t2ca t2ca mentioned this issue Jan 20, 2020
Merged
@blainekasten blainekasten added effort: low type: bug An issue or pull request relating to a bug in Gatsby labels Jan 21, 2020
@madalynrose
Copy link
Contributor

madalynrose commented Jan 21, 2020 •
edited
Loading

Thank you for filing this issue @t2ca! Could you confirm that adding top:0; to the list of styles for that div using browser dev tools fixes your issue? If that's the case, I'll whip up a PR!

@t2ca
Copy link
Contributor Author

t2ca commented Jan 21, 2020

Hey @madalynrose, yes I can confirm it fixes the issue.

@madalynrose madalynrose mentioned this issue Jan 22, 2020
Merged
jessestuart added a commit to jessestuart/jesses.io that referenced this issue Jan 24, 2020
@jessestuart
fix(ui): Upgrade Gatsby to fix gatsby-announcer bug.
17d66ab 
Seems there was a 1px div added that was causing
problems with designs containing `100vh` elements.
Related to gatsbyjs/gatsby#20728,
I think.

Signed-off-by: Jesse Stuart <hi@jessestuart.com>
jessestuart added a commit to jessestuart/jesses.io that referenced this issue Jan 24, 2020
@jessestuart
fix(ui): Upgrade Gatsby to fix gatsby-announcer bug. (#959)
d1c2d98 
* feat(ci): First pass: just build everything in CCI and push to netlify.

Signed-off-by: Jesse Stuart <hi@jessestuart.com>

* [commit message skipped]

* fix(ui): Upgrade Gatsby to fix `gatsby-announcer` bug.

Seems there was a 1px div added that was causing
problems with designs containing `100vh` elements.
Related to gatsbyjs/gatsby#20728,
I think.

Signed-off-by: Jesse Stuart <hi@jessestuart.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@madalynrose madalynrose

Labels
type: bug An issue or pull request relating to a bug in Gatsby
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix: remove 1px line from gatsby-announcer on 100vh pages gatsbyjs/gatsby
3 participants
@blainekasten @madalynrose @t2ca