Hello;
I have the following code that work well:
#clouds { background: transparent url("clouds.png") repeat-x scroll 305px 20px; height: 301px; margin: 0 auto; text-align: center; border: 0; }
Now, i would like to replace it with a sprite, I use an online generator that provide me the following new code to replace the current :
>
.sprite {display: inline-block; vertical-align: middle;} .sprite {background-image: url("sprite.png"); background-position: left center; background-repeat: no-repeat;} .sprite.clouds_png {background-position: 0 0; width: 1068px; height: 378px;}
For information the image clouds.png has a physical dimensions of 1068x378. The issue with the default replacement code generated by the website http://www.giftofspeed.com is that the image does not repeat itself and it didn't take all the width of the window like the original code do.
So is their an alternative to adapt the generated code in such a way to achieve exactly the same behavior of the first code ?
Thank you
Well; just replace
Well; just replace background-repeat: no-repeat; with background-repeat: repeat-x; resolve the problem.
Thank you
Glad we could help
gary
background repeat
Hi the background image or color repeat in this method to background-repeat:repeat-x(or)y,follow this code image or bgcolor are repeated in this your site.