I am trying to embed a background image on my freelance theme. I have successfully gotten the image as my background, but I am having trouble making it fit to my pages. When I try to scale it it either turns into a tile styled background or it gets way to large and it does not present the gradient correctly. Is there a way I can make the image fit the webpage correctly and even make it responsive to the size of the screen it is being viewed on?
The URL of my website is http://www.asmallbizlife.com
Colin, in your graphics program you need to make a slice of your gradient, say 20px wide and the full height of the gradient. Use that as your background image and tell it to repeat horizontally only. I usually set the background color to match the bottom edge of the gradient so it is seamless, like so:
background: #CC9 url(gradient.png) repeat-x;
Need more help? Find me on Twitter @gidgetthegeek
You must be logged in to reply to this topic.
Are you a blogger, web designer, developer, or website owner looking to generate more income?
Promote products for the largest and fastest growing online website platform as part of our affiliate program.