Need a new web host or having a problem with a script? Tips and advice on the best way to design, build and maintain your most valuable asset - your website!

How To Stretch The Background Image
nelsencaleb
Posts: 111
Joined: 16 Jul 10
Trust:
28 Apr 14 5:20 am

How To Stretch The Background Image

Hi, I'm wondering how to make my background "stretch" so it just gets larger with the web page. The aFFiLoRAaMa theme only allows for:
[list=]Tile[/list]
[list=]No Repeat Right[/list]
[list=]Repeat Horizontal[/list]
[list=]Repeat Vertically[/list]

Can anyone help here? I'd like it to just adjust with the page instead of any of those annoying and ugly options.
  • 0
cecille.l
Posts: 6369
Joined: 25 Feb 11
Trust:
29 Apr 14 7:26 am

 Hi Caleb,

Are you referring to the header background image? If so, there is no option to "stretch" it. It's best if you upload a header background that completely fills up the entire header. This means the size of the header image should be the entire size of the header.

For example, if the header size has a height of 150pixels and length of 240pixels, then your background image should have the same dimensions. Thus, when you upload the background, it occupies the entire space without having to stretch the image.

If the image you'll be using is small then you need to "stretch" the image to the same size as the header using photo editing tools like Gimp and Photoshop before uploading it to the theme.

Hope that helps. Have a good day!
  • 0
Cecille

Building affiliate marketing websites is a breeze: https://www.affilorama.com/affilojetpack
Like us on Facebook: https://www.facebook.com/affilorama
 
nelsencaleb
Posts: 111
Joined: 16 Jul 10
Trust:
29 Apr 14 5:57 pm

 Hi cecille, no I am talking about the websites BACKGROUND. Sort of like the background to this post page is a lighter gray. I would like to use an image and have it stretch when the browser is make larger instead of having it tile or repeat or show black when the picture is expanded further than it is large.
  • 0
Site Admin
aletta
Posts: 3392
Joined: 09 Jul 06
Trust:
29 Apr 14 10:41 pm

 Hi Nelsen,

This isn't as easy to do as it might sound, and likely requires a bit of CSS hackery and digging around through your theme editor. There is no easy way to do it in AffiloTheme because it's not a very common thing to do, and not really something we would recommend.

Here's one I found via the wonders of Google.

http://css-tricks.com/perfect-full-page ... und-image/

Keep in mind that a very large background image can be very slow to download, depending on the type of image. A simple GIF/PNG without many colours might not be a large file size, but if you're talking about a large photo.... it could be pretty hefty.

Also it is possible to make things very ugly doing this :)
Use with caution.
  • 0
Are your changes not showing up on your website? Try doing a hard refresh! http://www.refreshyourcache.com/en/cache/
 
nelsencaleb
Posts: 111
Joined: 16 Jul 10
Trust:
29 Apr 14 10:43 pm

 Alright, thanks for checking into that for me, I'll give that link a look and decide where to go from there!
  • 0

This topic was started on Apr 28, 2014 and has been closed due to inactivity. If you want to discuss this topic further, please create a new forum topic.

Topic locked