PDA

View Full Version : CSS-Layout help? IE6 inserts unexpected space below table



kwiat
03-13-2004, 03:16 PM
I've got different CSS layout problems concerning the redesign of a website which will be dedicated to an online shop selling items for online roleplaying games.

The redesigned website is planned to be set up in valid XHTML 1.0 Transitional.

Though it at first validated unter Strict, too, I've chosen this doctype because the content (main text, items etc.) is generated automatically by a content management system (CMS: OScommerce) and pasted into the XHTML template I did. This PHP generated code seems to contain presentational markup such as layout tables. For I am not allowed to change the PHP-Scripts I thought Transitional would fit the best.

You can reach my original template here: http://www.typorism.com/clients/gameconomy/gc.html
(URI of the CSS file: http://www.typorism.com/clients/gameconomy/gc.css)

The problem now is, while beeing viewed in IE6/Win and Mozilla Firefox, the template of mine shows no mistakes concerning these browser's rendering output. After inserting the HTML code of the CMS generated content IE6 inserts about 300 pixel space between a sample table and the rest of the content. Firefox doesn't show this behaviour.

An demonstration of the final HTML containing the CMS output is available here: http://www.typorism.com/clients/gameconomy/gc_testing.html
(URI of the CSS file: same as above)

As for a second, someone also sent me a screenshot he made while displaying the first of both sites in a newer Opera Browser. The layout wasn't displayed as I wanted it to do, too (spaces between or at the top of the graphics on the left caused the layout to break). I suppose the second website shows the same behaviour, I wasn't allowed to check it, yet.

I checked out different css relating websites and tried a lot, but didn't found any resolution to these problems. Would anyone help me, please? I'd be glad about responses and/or helpful css snippets!

With regards,
Andreas Kwiatkowski

r2d2
03-13-2004, 05:33 PM
Hi Andreas, welcome!

Looking at your code, it looks like the table is too wide to fit between the two floats, so it is being forced below them.

Try setting the widths of the tables in your 'content' div to 99%, or not setting a width at all - let us know what it looks like then