...

View Full Version : Help with a rather complicated background problem



naike
07-06-2011, 05:32 PM
http://img339.imageshack.us/img339/5719/problemog.png
Hey guys.
So everything in the picture are in <div> tags to start off.
If you look at the image, there is nothing really wrong with the design of the site at the moment, but that is a pretty large resolution, 1920x1080.
The problem arises with smaller resolutions like here for example:
http://img687.imageshack.us/img687/2116/problem2j.png
This was shot at 1280x1024 or 1024x768.

As you see, the background image is not aligned anymore.
Could you guys help me with ideas or actual fixes on how I should overcome this problem?
Like written on the image, I'm currently using a background image that is repeated on the y-axis and is then aligned with "scroll=(x)%".

I almost forgot to add, that the 2 side bars are also scaled by percentage, with "width=(x)%".

teedoff
07-06-2011, 05:44 PM
Would need a link to your live test site or, at the very least, all of your code posted here using the # button.

naike
07-06-2011, 05:59 PM
Would need a link to your live test site or, at the very least, all of your code posted here using the # button.

Hey.
Here's my live site.
http://naike.zapto.org/index.php

I just started out testing joomla and I like it, this is the theme/template I've come up with, and so far that is my only problem I've noticed.

naike
07-07-2011, 12:45 PM
bump :)

naike
07-08-2011, 07:51 PM
A little bump again, the site is online for view, so feel free to fiddle around with firebug or whatever.
I really haven't got a solution to this problem, I'm not very good at CSS so I don't know all possibilities there might be.
Currently, I'm kind of stuck here :/

teedoff
07-08-2011, 07:59 PM
Honestly, Ive looked at this issue more than a few times. I think the problem lies with the fact that the background color or should I say the TWO background colors(the light and dark grey) are all one background-color definition. Therefore, the darker gray doesnt "move" or expand when the sidebar elements do.

Maybe someone much more experienced than I here can figure something esle out for you, short of quite a bit of reworking your layout.

Ideally you probably should have worked up a two column layout, defined background colors or images for the left floated sidebar AND then another color or image for the right content section.

Again, sorry I dont have a more definitive answer for you, but in the meantime dont give up! There's always more than one way to code anything!

naike
07-08-2011, 08:01 PM
Yeah, I've been thinking of that too, but how would I create those columns?
Currently my 2 sidebar things are inside div tags, but they only expand as much as is needed, and aren't tables just bull****?

teedoff
07-08-2011, 08:09 PM
There are lots of tutorials on one, two, and three column layouts. Here (http://www.maxdesign.com.au/articles/css-layouts/two-liquid/)is one I like in particular.

naike
07-08-2011, 08:29 PM
There are lots of tutorials on one, two, and three column layouts. Here (http://www.maxdesign.com.au/articles/css-layouts/two-liquid/)is one I like in particular.

Yeah, but this tutorial you linked uses the same technique as I do, simply a background image with 2 colors and then just repeated, same problem in my case.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum