Search Support

Is there is a way to get the 'Screenshot Node' to stop cutting off the right side of a capture?

  • 6 replies
  • 1 has this problem
  • 36 views
  • Last reply by mnhollimon

more options

I can right click an image, select 'Inspect Element', highlight the node I want to capture, right click and select 'Screenshot Node' but the image captured is always missing pixels on the right side.

Attached screenshots

Chosen solution

Hi mnhollimon, this is a really useful feature -- other than this problem.

The truncation seems to occur on pages with a scroll bar -- I can replicate it on a test page when the body doesn't fit completely within the viewport after opening the Inspector (or by forcing a scrollbar): https://www.jeffersonscher.com/res/node-screenshot.html

There was a fix for that in Firefox 45 but it seems to have gotten lost somewhere. I added a comment about this hypothesis to an open bug for this problem:

https://bugzilla.mozilla.org/show_bug.cgi?id=1538256#c8

For the short term, when you need to screenshot a node on a page with a vertical scrollbar, you could temporarily remove the bar by adding

overflow: hidden;

to the element style rules for the body tag. Grab your screenshot, then uncheck the box. Perhaps there is a way to automate that, but nothing comes to mind that can handle all three steps.

Read this answer in context 👍 1

All Replies (6)

more options

Chosen Solution

Hi mnhollimon, this is a really useful feature -- other than this problem.

The truncation seems to occur on pages with a scroll bar -- I can replicate it on a test page when the body doesn't fit completely within the viewport after opening the Inspector (or by forcing a scrollbar): https://www.jeffersonscher.com/res/node-screenshot.html

There was a fix for that in Firefox 45 but it seems to have gotten lost somewhere. I added a comment about this hypothesis to an open bug for this problem:

https://bugzilla.mozilla.org/show_bug.cgi?id=1538256#c8

For the short term, when you need to screenshot a node on a page with a vertical scrollbar, you could temporarily remove the bar by adding

overflow: hidden;

to the element style rules for the body tag. Grab your screenshot, then uncheck the box. Perhaps there is a way to automate that, but nothing comes to mind that can handle all three steps.

Helpful?

more options

Ohmigosh, thanks so much!! For now I will use an extension to hide the scrollbar. You're a life saver!

Helpful?

more options

If you find an extension that works well for this, please report back on which one it is in case other users have the same question.

Helpful?

more options

You can try to zoom out the page to see if that makes a difference.

Helpful?

more options

cor-el said

You can try to zoom out the page to see if that makes a difference.

Unfortunately, that also make the screenshot smaller because it captures at the current zoom level.

Helpful?

more options

jscher2000 said

If you find an extension that works well for this, please report back on which one it is in case other users have the same question.

I am using this Firefox Extension to toggle the scrollbar: https://addons.mozilla.org/en-US/firefox/addon/hide-scrollbars/

Helpful?

Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.