Hi Guys,

Hoping you can help me as I'm new to dreamweaver.

My Clients site, http://www.iflyjetz.com/collision/

is using a DW Template, which is great and useful etc etc...

My problem is the white space below the content. It seems to be that I need to leave this white space in order to allow other pages, with longer content to fill it up ( i.e. http://www.iflyjetz.com/collision/privacy.html)

Obviously it is impossible to have every page the exact same amount of content so I am left with this position of the pages with les content having huge white spaces in them to allow for the pages with more content.

I know this would be easily solved if it was a normal site but I'd like to use the template as its so so handy and its my first time using it.

Any help or pointers in the right direction about how to solve this, would be much appreciated.

Also, while your at it a critique wouldn't go a miss! (Although this is not the final design its very close)

Thank you
iflyjetz

you need to remove the height from the #container and the #text elements. After that, it is just a problem with not clearing your floats. Clearing Floats

BTW, it is generally a very bad idea to have all the CSS in the head like that. Put it in an external stylesheet where it belongs.

Thanks for that,

Will work on both sugestions!

iflyjetz

Wayfarer,

That worked beautifully in IE after clearing the floats as suggested using the 'overflow ;' method, however in FF the #text and#container elements are inexplicably shifted over to the right side of the page, off the screen, the rest remains unchainged.

Regards,
iflyjetz

I'm not seeing what you are describing. Did you fix it?

Yes, I have fixed it but it only seems to work in IE.

In FF however it puts the #text and #container over to the right of the page

Sorry, I see almost no difference between FF3 and IE7. In IE6, however, you have some funky thing going on, including no PNG transparency in the header, and doubled margin bug on the left side, which happens when you have a float and a margin that go in the same direction in that browser.

I see,

the doubled margin bug, how can this be solved do you know?

Thanks

Yes, you set the div that is floating to {display: inline;}. Or better yet, use padding instead of margin, which will work here since there are no colors to throw off.

No Luck I'm afraid, the inline suggestion sent everything crazy, perhaps I did it wrong, but I added it to the #container? Was this right?
I have attached a screen shot so that we are on the same page.
Also, the margin rather than padding had no effect either unfortunately!

Where do I go from here????!!

Sorry for this, I really appreciate your help.

#container isn't what is floating, but rather #text. And you only need to send this to IE6, so you should use a conditional comment and create a separate stylesheet. Either that, or underscore the command:

CSS

#text {
_display: inline; /*for some reason IE6 sees this as valid*/
}

But as I said, it is easier to not use a margin, replacing it with padding instead.