Paradigm background
-
-
- Stephen
- Newbie
- Posts: 7
- Thanks: 0
-
Hello,
I set my website to 960px fixed but the background on everything still seems to change based on screen resolution. For example, when i create custom backgrounds at 1920x1080, the full image is visable when viewed on a 1080p monitor. But when switched to, say, a 1366x768 monitor on a laptop, the right part of the image is cut off.
I need the image to look the same on every screen resolution. Any help is appreciated!
Stephen
-
-
-
- Matt
- Preeminent Rocketeer
- Posts: 21561
- Thanks: 3090
- messin' with stuff
-
CSS background images are not responsive... they just aren't... they don't live inside of any container that you can constrain/scale... they live behind containers and things... you can try "background-position:cover;" on your background image with some custom CSS to get a sort of "centered/scaled" look... but that about the best you can do with background images...
What you can also do is swap the image based on browser size... if you have very large/high filesize images you'll want to be careful with having multiples loading all at once on page load... can slow things down a little... but so long as the images are optimized it could work well... You bascially just use some media queries to change/override your "background:url(path/to/image);" with a different image...
and... last note that probably should've been first: You really shouldn't have content you care about in background images... they're meant to set the style and feel of space, not render needed user content... they should sit behind important things, not be important themselves... - Last Edit: 9 years 7 months ago by Matt.
- SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT
-
Time to create page: 0.052 seconds