Hey everyone,
http://postspawn.3ftp.org
I'd like the background image to stay, no repeat
and every time you zoom out, the image doesnt distort/repeat
its because everytime you scroll down the image repeats itself
and i dont want it that way.
i want it similar to youtube backgrounds on channels
These are the css properties for background image. Choose your flavour
repeat The background image will be repeated both vertically and horizontally.
repeat-x The background image will be repeated only horizontally
repeat-y The background image will be repeated only vertically
no-repeat The background-image will not be repeated
inherit Specifies that the setting of the background-repeat property should be inherited from the parent element
Unless you have an image with seamless edges, that isn't possible.
YouTube backgrounds are really well designed - my own background has a picture repeated twice on it.
Edit: Well, it is possible the way Lee posted, but I interpreted it as you wanted to avoid an obvious repeat of images.
Yes, good point from Seabody - what you can do is have two images - one left, one right and a gap in the middle where the container goes.
The background image similar to this theme:
http://www.awesomestyles.com/mybb-themes...4-v2-space
its a background image as one, and when you zoom out it doesn't ruin the background image, and it doesnt repeat too.
So what im trying to to do with my forum's background image is to make it compatible for all resolutions.
Ah, you want it fixed? I think the CSS code is:
position:fixed;
top:0px;
left:0px;
Positioning isn't my strong point though.
Its a free theme - download it, look how it is done and add a credit in your footer if you use their idea.
What I did,
background:#f2f2f2 url("bg url");
background-repeat: no-repeat;
background-position: center top;
Right code, but why 3 lines?
Its good to go:
background: #f2f2f2 url(bgurl/without.quote) top no-repeat;
center is not required to mention, it is default.
Extended read:
http://puplone.com/showthread.php?tid=24
(2012-09-22, 01:55 PM)effone Wrote: [ -> ]center is not required to mention, it is default.
I'm sorry but that is incorrect. The background-position property is supported in all major browsers BUT must require the center position aswell.
For this to work in Firefox and Opera, the background-attachment property must be set to "fixed":
background-attachment:fixed;
SOURCE:
http://www.w3schools.com/cssref/pr_backg...sition.asp