PX to pixel display ratio
I use HTML files to create images for a tile based game we play. 6 months ago I was able to create a table with collapsed borders and 0px padding, margins, and borders, then draw my image with 207 x 207 JPEG TDs in multiple TR rows, then place another GIF image over all the JPEGs with transparent edges. Doing this for a table that was 6 tiles (207px) wide and 4 tiles deep, at ctrl 0, displayed a Firefox combined image that was exactly 1242px x 828px that was completely visible on 24 inch 1920 x 1080 DELL monitor. This allowed me to right click an empty space on my Firefox screen and select Take Screenshot to click on the GIF overlay image and capture that image with all of the tiles that were behind its transparent edges.
For some reason, I have no idea why, my 207px by 207px tile images are now being displayed as 282px by 282px at ctrl 0, and the overall image is now too large to fit on the screen, so taking a screenshot of the proper sized image is no longer possible. For example, at ctrl- ctrl-, the tile images are 221 pixels square, which should be 1326 pixels wide for 6 tiles, but my 1242px wide GIF file displays at 1330 pixels wide, probably due to some kind of rounding error.
I was able to use about:config and change layout.css.devPixelsPerPx from -1.0 to 0.74 and it did solve the problem. But it does so with a lot of warning for changing that default value!
So my question is simple: how does Firefox, on Windows 10, determine its screen pixel to Image px relationship? I need to know what to look at for the proper way to get my px to pixel ratio back to 1 to 1.
This is what the working image looks like while designing the center scoreboard tile https://user-media-prod-cdn.itsre-sumo.mozilla.net/uploads/images/2022-08-23-13-36-34-2fa67f.png
and this is what the final image looks like when you take a screenshot of the image https://user-media-prod-cdn.itsre-sumo.mozilla.net/uploads/images/2022-08-23-13-36-53-beae42.png
Chosen solution
You can look at this thread:
- /questions/1384204 SINCE THE LAST UPDATE, THE FIREFOX SCREEN DOES NOT FIT MY SYSTEM SETTING(125%)
If setting browser.display.os-zoom-behavior = 0 doesn't work for you then you can create a new Number pref on the about:config page and set its value to 100.
Paste ui.textScaleFactor in the search bar and select the Number radio button and click the '+' button to add the new Number pref, enter the value (100) and click the blue OK button to confirm.
- about:config => ui.textScaleFactor = 100
You can open the about:config page via the location/address bar. You can accept the warning and click "I accept the risk!" to continue.
Read this answer in context 👍 0All Replies (2)
Chosen Solution
You can look at this thread:
- /questions/1384204 SINCE THE LAST UPDATE, THE FIREFOX SCREEN DOES NOT FIT MY SYSTEM SETTING(125%)
If setting browser.display.os-zoom-behavior = 0 doesn't work for you then you can create a new Number pref on the about:config page and set its value to 100.
Paste ui.textScaleFactor in the search bar and select the Number radio button and click the '+' button to add the new Number pref, enter the value (100) and click the blue OK button to confirm.
- about:config => ui.textScaleFactor = 100
You can open the about:config page via the location/address bar. You can accept the warning and click "I accept the risk!" to continue.
Thank you for the reply. My problem is now fixed!
I went back to about:config and looked for browser.display.os-zoom-behavior, and it was set to a value of 1, so as recommended, I change the value to 0.
As expected, because of my other change (layout.css.devPixelsPerPx set to 0.74), my images were now smaller than they should be! So, I then change the layout.css.devPixelsPerPx back to a -1.0 and everything is working fine.
Do you have any idea what might have caused the os-zoom-behavior to change, was there an update?