Space Below DIV

[wemustdesign]

I am designing a new site for myself. I have added a function where the user can increase the font size. The problem is that a space occurs when this occurs. Have a look at this test page to see what I mean:

Test Page

Any suggestions how I can get rid of this space?

[Maujor]

You can hidde the space, changing the background-color:#00FF00; for div#footerwrapper to background-color:#000000;

[Nadia P]

What space, where?

Have you seen the page in Firefox, your bottom footer is aligned to the left, not centered as I believe you want it.

Also the text in the breadcrumb div overlaps the orange box when you increase the size. If you change the height from 15px to something like 1.5em, the text doesn't overlap when text size is increased.

Nadia

[fisherboy]

Gidday. There are several problems.

One is that you need margin:0 auto; applied to #divfooterwrapper instead of #orangefooter.

Will keep looking and try and help with a couple of other things this pm.

[fisherboy]

Nadia is right. Try setting the heights of all divs containing text to em's. This should fix most of your problems, including the lime green gap that appears at the bottom in IE.

There is also an odd positioning thing in IE with the larger font/smaller font link text when you increase and then decrease the size.

Hope this helps.

[wemustdesign]

Thanks for your responses. I had seen that the text was overlapping in Firefox. I tried using em and it got rid of this problem so thax for that! Am going to change all of the heights etc to em to see if it irons out any more problems.

Thanks again!

[fisherboy]

Looking MUCH better today. Well done! Let us know when its finished. Would love to see how it turns out.