floating div alignment issue with IE

[twistie.man]

Okay so i'm developing a website: screenie.org.
For simplicity i'm using SMF as a basis for the user system. Most of
the site is almost completed but I have had issues getting the sites
new theme to work properly with IE 6.5 and below. It works perfectly in
Firefox, IE7 and Netscape. It has some issues in Opera which aren't too
bad. But the biggest problem seems to be that IE 6.5 and below refuses
to render the page the way the other browsers do. The page uses a
series of aligned divs rather than the old table layout method.

The page is: http://screenie.org/forums

If you browse to the forum address in IE 6.5 or below you will notice
that the page content aligns below the menu div. How do I prevent this
from happening?

[Schraalhans Keukenmeester]

tw*********@gma il.com wrote:

Okay so i'm developing a website: screenie.org.
For simplicity i'm using SMF as a basis for the user system. Most of
the site is almost completed but I have had issues getting the sites
new theme to work properly with IE 6.5 and below. It works perfectly in
Firefox, IE7 and Netscape. It has some issues in Opera which aren't too
bad. But the biggest problem seems to be that IE 6.5 and below refuses
to render the page the way the other browsers do. The page uses a
series of aligned divs rather than the old table layout method.

The page is: http://screenie.org/forums

If you browse to the forum address in IE 6.5 or below you will notice
that the page content aligns below the menu div. How do I prevent this
from happening?

The xhtml does not conform to the standard it claims to.
With 37 errors and about 8 additional warnings there's a bit of work to
do. Perhaps parsing it as html4 transitional you stand a better chance
of having it conform to a standard.

The css does qualify, but with 285 warnings at least it's far from
ideal. Add to that IE's notorious bugginess regarding CSS standards
conformance. I bet the css is bloated as h***.

I've quickly glimpsed through it, and it's a nightmare to decipher.
Does the original CSS as it came with SMF exhibit the same issue?
If not, work from that point, step by step until you find the culprit.

Or, which won't sound nice, print out the css and work it into a correct
and concise version first.

Sh.

[twistie.man]

Schraalhans Keukenmeester wrote:

tw*********@gma il.com wrote:

Okay so i'm developing a website: screenie.org.
For simplicity i'm using SMF as a basis for the user system. Most of
the site is almost completed but I have had issues getting the sites
new theme to work properly with IE 6.5 and below. It works perfectly in
Firefox, IE7 and Netscape. It has some issues in Opera which aren't too
bad. But the biggest problem seems to be that IE 6.5 and below refuses
to render the page the way the other browsers do. The page uses a
series of aligned divs rather than the old table layout method.

The page is: http://screenie.org/forums

If you browse to the forum address in IE 6.5 or below you will notice
that the page content aligns below the menu div. How do I prevent this
from happening?

The xhtml does not conform to the standard it claims to.
With 37 errors and about 8 additional warnings there's a bit of work to
do. Perhaps parsing it as html4 transitional you stand a better chance
of having it conform to a standard.

The css does qualify, but with 285 warnings at least it's far from
ideal. Add to that IE's notorious bugginess regarding CSS standards
conformance. I bet the css is bloated as h***.

I've quickly glimpsed through it, and it's a nightmare to decipher.
Does the original CSS as it came with SMF exhibit the same issue?
If not, work from that point, step by step until you find the culprit.

Or, which won't sound nice, print out the css and work it into a correct
and concise version first.

Sh.

This skin is based off another skin which claims to be compliant but it
nowhere near it. I've fixed most of the errors and 'most' pages
validate as valid html 4.0 transitional. I am also working on getting
rid of some of the warnings for the CSS but its alot of work, I am also
in the process of making the CSS a bit clearer by line breaking and
tabbing it. The CSS is actually fairly efficient but my main problem is
the alignment in the old IE. I still havn't been able to work out why
it is aligning below the other div.

[twistie]

On Nov 30, 5:17 pm, twistie....@gma il.com wrote:

Schraalhans Keukenmeester wrote:

twistie....@gma il.com wrote:

Okay so i'm developing a website: screenie.org.
For simplicity i'm using SMF as a basis for the user system. Most of
the site is almost completed but I have had issues getting the sites
new theme to work properly with IE 6.5 and below. It works perfectly in
Firefox, IE7 and Netscape. It has some issues in Opera which aren't too
bad. But the biggest problem seems to be that IE 6.5 and below refuses
to render the page the way the other browsers do. The page uses a
series of aligned divs rather than the old table layout method.

The page is:http://screenie.org/forums

If you browse to the forum address in IE 6.5 or below you will notice
that the page content aligns below the menu div. How do I prevent this
from happening?

The xhtml does not conform to the standard it claims to.
With 37 errors and about 8 additional warnings there's a bit of work to
do. Perhaps parsing it as html4 transitional you stand a better chance
of having it conform to a standard.

The css does qualify, but with 285 warnings at least it's far from
ideal. Add to that IE's notorious bugginess regarding CSS standards
conformance. I bet the css is bloated as h***.

I've quickly glimpsed through it, and it's a nightmare to decipher.
Does the original CSS as it came with SMF exhibit the same issue?
If not, work from that point, step by step until you find the culprit.

Or, which won't sound nice, print out the css and work it into a correct
and concise version first.

Sh.This skin is based off another skin which claims to be compliant but it

nowhere near it. I've fixed most of the errors and 'most' pages
validate as valid html 4.0 transitional. I am also working on getting
rid of some of the warnings for the CSS but its alot of work, I am also
in the process of making the CSS a bit clearer by line breaking and
tabbing it. The CSS is actually fairly efficient but my main problem is
the alignment in the old IE. I still havn't been able to work out why
it is aligning below the other div.

I have do

[Saul]

tw*********@gma il.com wrote:

This skin is based off another skin which claims to be compliant but it
nowhere near it. I've fixed most of the errors and 'most' pages
validate as valid html 4.0 transitional. I am also working on getting
rid of some of the warnings for the CSS but its alot of work, I am also
in the process of making the CSS a bit clearer by line breaking and
tabbing it. The CSS is actually fairly efficient but my main problem is
the alignment in the old IE. I still havn't been able to work out why
it is aligning below the other div.

My guess (not tested) is that it's to do with the .pagecontent with
left margin 190px, a table and 100% width and a right margin. So I
would guess IE6 is filling the centre of the div with the table to make
it that .pagecontent itself is 100% of the page width, not 100% of the
remaining space. The result is IE6 can't fit .pagecontent in to the
left of .headerarea and so forces a line break.

I haven't tried it, but my guess is that removing/reducing the
margin-left from .pagecontent and making .pagecontent float:left may
fix the problem. Or removing the width=100% from the table.

To debug float problems like this we tend to add coloured borders to
everything (border: 1px solid #f00) to clarify exactly how each floated
element is behaving and to see what is lining up against what.

Saul
www.notanant.com