Background isnt displaying right

[Danaldinho]

Hi, on my forum: http://www.lilwaynehq.com/forums I have designed the whole theme and I am adding 4 styles to the navbar under the logo to switch the colour of the forums, so the members can have a choice of templates. Anyway on the default (red/brown) style and the green style you will notice that the background which is a picture of stripes with a gradient on, then links to the backgrounds normal colour look fine and perfect, but on the grey and blue styles, the background images don't look right.

On the blue style, for some reason, you can see were the new image starts if you get me and on the grey style, the striped image should go all the way down the page for the background, but it doesn't.

I don't understand why this is happening, but the funny thing is, I am using the exact same code for the blue and grey style as what I used for the default and green style :confused:

Anyone know how I would fix this and what the error is

Thanks so much :)

[VIPStephan]

The stripes in the blue image are thicker than in the red and green ones, that’s why the pattern doesn’t match if it’s repeating. For the gray theme change this style in grey.css appropriately:

html, body {
color: #FFFFFF;
background-color: #3E3E3E;
background-image: url("http://www.lilwaynehq.com/greystripes.jpg");
background-repeat:repeat-x;
}

[Danaldinho]

Hi Steve, I changed the background-repeat to:

background-repeat:repeat-y;

And if you look on the forum now, it goes vertical now

[VIPStephan]

There’s not only repeat-x and repeat-y, there is a general “repeat” as well – which is the default anyway, so you can just leave it out:

body {
color: #FFF;
background: #3E3E3E url("http://www.lilwaynehq.com/greystripes.jpg");
}

The above is the shorthand way of writing it which combines bg color, image, position, repeat, and attachment (in any order, i. e. values can be interchanged):

background: [color] [image] [x-position] [y-position] [repeat] [attachement];

The position values cannot be interchanged at free will, though. If you define both then they must come in pairs and unless you specify literal values (i. e. “top”, “right”, etc.) the x-position comes first. If left out default position is top left.

http://htmldog.com/reference/cssproperties/background/

[Danaldinho]

Worked mate cheers :thumbsup: