Quick CSS question

DezUk · 24 Feb 2010 at 19:48

I am working on a little design idea using a repeating diagonal background which is working fine. I have made a banner background which also uses the diagonal background but also has a slight gradient overlay applied and i want this to repeat 100% of the width. At the moment i just have a banner image of 850px (width of the main content) and have it set to repeat-x but as expected I am getting an obvious line break when it repeats.

Can anyone suggest how I could cut up the banner image to repeat without a flaw?

The site is here:
http://rdoyle.info/wedding/

CSS is here:
http://rdoyle.info/wedding/layout.css

And banner is here:
http://rdoyle.info/wedding/images/banner.png

DezUk · 24 Feb 2010 at 20:29

Thanks mate that fixed it

Any ideas on why it wont stretch 100% height wise?

in fact think I fixed it!

DezUk · 24 Feb 2010 at 21:58

Couple other things, I am using Chrome to test my design and it looks fine yet when i test it in Firefox the colours are slightly different between the banner and the background image i use which results in a seam showing. My main content background is also not showing firefox.

It also looks fine in Safari

Any ideas why?

Update: i just checked my hex colors and made changes and now its looks fine in FF but chrome shows the colors wrongly now

DezUk · 25 Feb 2010 at 08:27

Wel i have two versions up now one that works in chrome and safari yet doesnt work in firefox

http://rdoyle.info/wedding/v2

And one that works in firefox yet not chrome and safari

http://rdoyle.info/wedding/

It seems the different browsers seem to render the colours on the background images differently or am I being stupid?

DezUk · 25 Feb 2010 at 12:11

Thanks for the feedback folks, appreciated!

I want to use the brigter colours of v2, think the issue there is with the banner background using slightlhy different colours. I will try fixing that when i get home tonight.