Hello Tech heads

I've got this huge problem with a website that I've recently done for a client. What is more, I get different results in both IE and Firefox.

The website has a centered div tag for all of it's content, with tables inside the div tag for positioning, and I have used a 1px high background image, with repeat y set on the body.

You can see the problem here at http://www.alquilar-pisos-en-valencia.es

If the width of the browser window is right, the background image lines up centered correctly with the contents of the div tag, but if not, either the width is too short or too long, then there is a noticable mess up on the page.

Can somebody help me sort this out please?

If anyone is interested or needs the site files, I'll be more than happy to zip it up and put it on the server for download.

Many thanks.

Davinski

I see it in only in FF. Have you tried to use a larger background image, say 15-20 pixels or so? It may help if the browser doesn't have to redraw the image so many times.

Where the heck did your post go? I got a notification about it.

OK, what I said won't solve that the background doesn't go all the way down but it could have to to with the broken up pattern. That looks like a rendering problem.

Normally a backgound for BODY covers the whole canvas, even if BODY itself doesn't go all the way down. In FF, and maybe some other browsers, that isn't true under some circumstanced that I have forgotten. I'll shake my head and see if something falls into place.

Funny?

I posted a reply with some screen shot links to the problem and I even saw the post when I refreshed the page :S

I'm going to post them up again! I haven't received anything from an admin so I dunno :S

Basically, I wrote that I forgot to mention that I had different results from both IE and Firefox, with FireFox showing the page half correctly, and IE getting it right where FireFox is getting it wrong and visa versa. All very confusing; take a look at the screen shots to get a better understanding. Note the areas in the marked RED BOXES.

FireFox

http://www.alquilar-pisos-en-valencia.es/s.../gv.ff.good.jpg
http://www.alquilar-pisos-en-valencia.es/s...s/gv.ff.bad.jpg

IE
http://www.alquilar-pisos-en-valencia.es/s.../gv.ie.good.jpg
http://www.alquilar-pisos-en-valencia.es/s...s/gv.ie.bad.jpg

Thanks for your time Pandy, much appreciated.

Davinski

I overcomplicated things. I've glanced at your code now and you have positioned BODY absolutely. Why? You also do some trick with 100% height. For that to work you need 100% height for HTML too, not only BODY. See if that fixes it.

I'm glad about the evaporated post. Because once there were absolutely no replies in a thread. I posted. Later there were replies above mine. Very peculiar. Now I know I'm not crazy. Let's see if your post shows up later too. This could be fun!

Paddy,

Glad my post is finally sticking!

I've just changed the main css file, gv.css on the server to include

html
{
height: 100%
}

It doesn't seem to be working though any other ideas?

Thanks

Davinski

Are you sure? It works when I try locally with your HTML. Still gets a gap at the top of the page though that I don't understand where it comes from.

Hi Paddy,

Just out of curiosity, which version of FireFox are you testing this on? Because I can't see the gap at the top of the page that you are mentioning :S

And I am sure about the HTML 100% thingy.

In the style sheet, gv.css I placed

html
{
height: 100%;
}

Is this the correct way or should I declare this some other way?

Thanks

Davinski

Btw, I'm a little thick, I'm reading one of your previous posts again where you ask me about the 'absolute positioning of the BODY and the trickery with the 100% thingy.

To answer that, when I was searching on how to make the background reach all the way to the bottom I stumbled upon a website that showed off a few tricks, which I employed here.

I'm going to try and find the links and post them up for all.

Question: How should I be doing what I want to do?

Many thanks

Davinski

I don't know. I'm trying to figure out what in your CSS that makes the background not go all the way in the first place. BTW what happens if you use the background with HTML instead of BODY?