From table to css on IE6...

Hello,

For the "shows" listing on my band's homepage I use tables. See the
page at
http://deimos.curious.be/~dusk/v2/shows.php

Since we aren't exactly dealing with "tabular data" here I wanted to
convert this exact layout using only divs, with css to position them.
This is what I came up with:
http://deimos.curious.be/~dusk/v2/showtable.html

Mission accomplished on FF, Opera and Konqueror, but IE6 of course
messes it up. For some reason the top and bottom row of divs is shifted
to the right. Any workarounds, or is there actually a bug in my css?

Tia
Tommy

Nevermind, I just found a workaround myself. I removed the
text-align:center; from the encapsulating div and gave that property to
all the inner divs. It seems that IE not only centers text, but also
other elements (in casu: divs) when using text-align.
Too bad, because now my code is bloated thanks to IE...

TomB wrote:

Nevermind, I just found a workaround myself. I removed the
text-align:center; from the encapsulating div and gave that property
to all the inner divs. It seems that IE not only centers text, but
also other elements (in casu: divs) when using text-align.
Too bad, because now my code is bloated thanks to IE...

Isn't that correct behavior though?

According to my O REILLY CSS Pocket Reference, 2nd Ed, on page 93, for
text-align, "Applies to:" lists "Block-level elements", and DIVs are by
default block-level so it makes sense. So if the outer div uses
text-align: center; any block level element should be centered, so it
seems IE does that more correctly in this reguard. Please correct me if
I'm wrong though.

I do wish that with DIVs there was a much more clearer way to set
Horizonal and Vertical alignment for anything within a DIV, a la table
cells (and also appears right in all browsers, as wishful-thinking-eque
that mya be.)

--
Stan

Stan R. schreef:

TomB wrote:
Nevermind, I just found a workaround myself. I removed the
text-align:center; from the encapsulating div and gave that property
to all the inner divs. It seems that IE not only centers text, but
also other elements (in casu: divs) when using text-align.
Too bad, because now my code is bloated thanks to IE...

Isn't that correct behavior though?

According to my O REILLY CSS Pocket Reference, 2nd Ed, on page 93, for
text-align, "Applies to:" lists "Block-level elements", and DIVs are by
default block-level so it makes sense. So if the outer div uses
text-align: center; any block level element should be centered, so it
seems IE does that more correctly in this reguard. Please correct me if
I'm wrong though

You have got a point there, although out of some kind of "gut feeling"
I expected that the position of divs wouldn't be affected by
text-align...
But yes, IE seems te be doing the correct thing here. Blimey!

TomB wrote:

Stan R. schreef:

TomB wrote:
Nevermind, I just found a workaround myself. I removed the
text-align:center; from the encapsulating div and gave that property
to all the inner divs. It seems that IE not only centers text, but
also other elements (in casu: divs) when using text-align.
Too bad, because now my code is bloated thanks to IE...

Isn't that correct behavior though?

No.

According to my O REILLY CSS Pocket Reference, 2nd Ed, on page 93, for
text-align, "Applies to:" lists "Block-level elements", and DIVs are by
default block-level so it makes sense. So if the outer div uses
text-align: center; any block level element should be centered,

No. It means that you can give <div> and <p> (block level elements)
the text-align property. Not that it should center block level
elements inside of it. (it's not "blockelement-align", but
"text-align")

so it
seems IE does that more correctly in this reguard. Please correct me if
I'm wrong though

Done ;-)

You have got a point there, although out of some kind of "gut feeling"
I expected that the position of divs wouldn't be affected by
text-align...
But yes, IE seems te be doing the correct thing here. Blimey!

Your gut feeling was right though...

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/