This is for the dashboard page - @4k resolution
Simply at the top of the css (for example default-gray.css)
@media (max-width:1280px){#template{min-width:1260px;max-width:1260px;margin:0}}
@media (min-width:1281px){#template{min-width:1260px;margin:0}}
@media (min-width:1921px){#template{min-width:1260px;max-width:1920px;margin:0 auto}}
Add something like this below it (basically, just allow for resolutions (much) larger than 1920-
@media (min-width:2880px){#template{min-width:2200px;max-width:2400px;margin:0 auto}}
@media (min-width:3160px){#template{min-width:2800px;max-width:3000px;margin:0 auto}}
@media (min-width:4200px){#template{min-width:3700px;max-width:4000px;margin:0 auto}}
Pick your numbers appropriately, but there need to be larger templates. I cant recall the values I specifically used, they should be based on standard resolutions I guess, but should permit 2K, 4K/1.5, 4K/1.25, 4K, 8K/1.5, 8K/1.25
If the above numbers dont make sense, they are for native resolutions in hardware, and OS based scaling factors. 8K/2 = 4k and 4K/2=2k so the 2.0 scaling can be neglected. It gets more complicated with the browser scaling, but just permitting X dimensions larger than 1920 fixes everything.
Otherwise the third column falls underneath (and to the right) of the middle column due to the other flexible rendering options.
I played with this for a long time, and this is the simple fix.
Recommended Comments
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.