8 replies to this topic

[amirrainer]

Hi,

I really tried finding the answer in the forums, but couldn't, so posting my issue in a new topic.

I'm using an image as a background (set globally to the entire website).
when not "supersizing" the background image, the footer is not transparent, so a white background is shown and not the image background.

I would really appreciate your help.

Amir.

[amirrainer]

changed to fixed-width mode, and it looks fine.
anyway to do it with full-width sections?

[catrina]

You can try using CSS to make the footer transparent:

Please Login or Register to see this Hidden Content

[amirrainer]

thanks.
After supersizing the BG, when the browser's window is not on the same size as the BG image (1280*728) or I view it on the iphone, the BG is not centered and goes left.
you can see it here:

Please Login or Register to see this Hidden Content

b.t.w, so I was wondering, what is the best size for the BG image in supersized mode?

many thanks

Amir.

[James B]

We've had some instances where the image size was too large and if it was over a set DPI the background didn't react properly on mobile devices. Try resizing the background so its slightly smaller. The supersize background only scales using the height, so you might have to edit the bg image slightly so it scales correctly into the layout, bring the width in a bit.

[amirrainer]

Hi James, thanks for the reply.
tried scaling the width a bit, same result. you can see the effect when you scaling the width of the browser... you see white background replacing the BG on the left.

[catrina]

I see this happening on the left side with the white overlay, but I also see this happening on the right side (on Firefox for Mac). Is this what you mean? The white overlay background color behaves that way because of padding.

[amirrainer]

Ok. I think I understand the problem now.
while the native proportions of the BG remains the same, no matter what size it is, it scales perfectly.
the problem begins when the proportions change and the browser width narrows down. no problem with any changes in height, though.
this is why we see the problem when we view it on the iPhone only in vertical mode.
any way to fix that?

many thanks for your great support.

Amir.

[Rob]

Image scaling is proportional.  So a 1000px by 500px background image will easily become 2000px by 1000px.   But an image of 1000px by 500px will not scale to 1200px by 900px.  So, in many browsers and monitors, background images are often found to be short.  Supersize stretches the image, but can make it look odd,  or you can use tiling.  People who view sites on very large monitors often have high resolution, but very wide screens, so the images have to coordinate with that.

 

One magic trick is to apply a background that has a solid color at the bottom of the image, then have the footer use the same color (by hex code) as its background color.  Then the image blends right into the footer seamlessly.  See the background at

Please Login or Register to see this Hidden Content

as an example.