CSS / Firefox and the background image

[bigbruce]

Thought I'd be very clever and add a small background image on a div statement which repeats on the y axis, so I get a column of colour on the left hand side.

The div statement is of variable height and works fine with IE6, but refuses to work on Firefox. I have height:auto in the CSS.

I have considerably less hair than when I started. Does anyone have a cure for the Firefox problem and my hair loss? Please!!!!

[drhowarddrfine]

Without a link, or the complete code, we can't help you.

[bigbruce]

Code and stylesheet both available at http://wellsclinic.web-dezignz.co.uk. The background should go behind the ul extending the colour by about 20 pixels, as per IE6.

[drhowarddrfine]

Actually it should not and IE is erring by doing so. You say the ul.nav should only be 235px wide and there is no content beyond that so the .nav is collapsed to 235 while IE fills it in. Change ul.nav to 250px and see if this is what you want.

[bigbruce]

It is not the .nav that has the background, it is .centredata, the div containing it and the rest of the page. My client wants the border to stop before the edge of the colour, so my way round this was not to increase the size of the .nav, but to put an 250px wide image of the background colour on .centredata and then repeat it down the y-axis, filling to the required length.

[gYnophObia]

eh... is this solved yet? ... im not sure what your asking big bruce... is this (http://img104.imageshack.us/my.php?image=untitled3copy9rf.jpg) what you are trying to accomplish?

[bigbruce]

No. Not solved yet, and that's not what I want. If you look at the page in IE, that is what I want. I just can't get Firefox to do the same thing.

The ul li is 235 px wide and sits inside .nav which is 250 px and then inside a much wider (1000px) div .centredata which has a background image repeating down the Y-axis. The background image is 250 x 5 and so should sit behind the .nav extending down the page for however long the longest div is in .centredata. Or so it would seem to both me and IE.

I can't specify a height (which solves the problem), because the pages are variable in length. I suspect that either Firefox is not able to cope with an unspecified height or, I have additional info in my CSS which is causing Firefox to throw it's hands up and say I can't interpret this.

I can't increase the width of the li element and specify a percentage width for the element with the border, as this will be OK for the list, but any other items e.g. the picture, will not be covered.