rendered page is clipped in Chrome print preview - google-chrome

I encountered an issue with Print Preview in Google Chrome that has me stumped.
Here are two different URLs, both of which retrieve the same digital certificate, but the one fetched from ‘issuer-icef.netlify.app’ is exhibiting random clipping errors (explained below), while the one fetched from ‘certificates-icef.nextid.com’ does not exhibit clipping.
https://issuer-icef.netlify.app/certificate?id=5e1f5910-6866-4ccf-8446-5b91f927bfbe (random clipping errors)
https://certificates-icef.nextid.com/certificate?id=5e1f5910-6866-4ccf-8446-5b91f927bfbe (does not fail)
The clipping is an intermittent problem so you may not notice it right away and this is separate from cropping of the certificate when viewed in portrait mode. In order to recreate the issue, open the certificate, click on ‘Print/PDF’ and toggle between ‘portrait’ and ‘landscape’ mode. When the print preview fails, the certificate appears to be only partially drawn or clipped. The upper left part of the certificate can be seen, but the rest of the certificate does not appear as expected.
Any idea what can cause such an issue?

Related

Input fields and other objects display fading boxes around such elements only in CCleaner Browser A.K.A. Chrome Browser

I've got an issue going on with my CCleaner internet web browser (which is built on Chrome). These silver-white borders appear over elements on web pages, and even the whole page itself, whenever I click on such an element. It only happens inside the CCleaner browser window, not in "regular" Chrome.
Here I would like to provide an example, taken from my edit account settings here on Stack Overflow dot com (a page you can look at that is exactly the same as mine except for my issue with my web browser).
OK so in that pic the border you see around the text entry box is what I get all the time. The box is not permanent; it slowly fades out and dissolves.
How do I prevent these silver borders from appearing in the first place?

Chrome device mode shows background color where there is none

My site works fine in all major browsers including Chrome desktop and mobile. Now I noticed that when entering the device mode in Chrome devtools (Chrome 46) a portion of the page that has no background color set appears in dark grey. When inspecting the elements in this area none has a background color set.
As I have mentioned earlier, this does not happen in Chrome on mobile or any other browser.
The site is here. It only happens when first loading the page. (After clicking around on the site the body element has a white background color set and the glitch is not happening anymore.)
Any ideas what causes this?
Update: Gabee points out below:
Unable to reproduce on the latest Canary with the new Device Mode (but I can on the stable), so (...) [y]ou just need to wait for the next update (or two?) for the fix to land
I consider this solved, then.
As Gabee points out:
Unable to reproduce on the latest Canary with the new Device Mode (but I can on the stable), so (...) [y]ou just need to wait for the next update (or two?) for the fix to land
I consider this solved.

Strange Inconsistent rendering in Chrome

i have a website with alot of popup windows and z-index going on.
Chrome version: 46.0.2490.80 m (never seen in other browser, but cannot omit it)
Everything works fine, but every 50th (not precisely, but very rarely when opening popup or coming back from alt-tab)
Behind all this: my website.
The red: the fullscreen overlay beneath my popup.
The lightGray: my popup window.
The darkgray: popup content.
So for some reason, the corner of my div is cut off. The problem is not connected to this particular popup, or this particular corner.
I have sometimes seen this following an alt-tab into chrome, but not enough to say that's the problem.
I have never seen anything like this, usually it works or breaks, this time its working breaked.
Any clues?

Firefox rendering inconsistently and with black areas on redraw

I have a site (http://www.iproconnect.com.au/) that for one user (that I know of) renders the home page with black areas in Firefox. These do not seem to be tied to CSS, as if I force a re-draw of an affected area (e.g. by scrolling areas in and out of the viewport) it sometimes renders correctly, and sometimes incorrectly but differently to the previous incorrectly. Also if I do this with the inspector open, no CSS seems to change, and hovering background URLs show the image downloaded correctly.
I can't reproduce this in other installations of Firefox (all running the same version - fully up to date). And this user has un-installed and re-installed with no change in behavior.
I don't even know how to debug this further, let alone how to solve. Any ideas greatly appreciated.

Empty area appears at the bottom of page on chrome

I have problem on my website. If I open my website with HTTPS protocol, chrome shows an empty area at the bottom of page.
You can reproduce this if follows this steps:
Open new separate incognito tab using the lastest chrome version on windows
Go to this page. It will show a message that certificate is invalid. Ignore it.
At the bottom of page should appear unused area.
Why chrome shows this empty area on my page? It will disappear if I resize window. I also tried to disable all plugins, but it didn't help.
Depending on which version of Chrome that you are using, there is a reported issue of this grey area displaying only when the "Show bookmarks" (ctrl-shift B) is selected. Here is a link to the bug report: https://code.google.com/p/chromium/issues/detail?id=139765
The issue purports to be fixed in the current version of Chrome.