Eliminating final table in XHTML source

[Philip TAYLOR [PC87S/O-XP]]

Attempting to do away with all superfluous use of tables
(i.e., tables used solely for layout) on our corporate web site,
I have reached an impasse : I have one table left
(containing a single cell) which, if removed or replaced
by a <div> or <span>, causes the vertically-repeating background
image at far-left of the design to disappear.

The two variants of the page, one with and one without tables,
can be seen at

http://www.royal-holloway.org.uk/Ser...x-notable.html

and

http://www.royal-holloway.org.uk/Ser...-onetable.html

I would much appreciate any insights into why the final
table cannot be eliminated without loss of the tesselating
background image ...

Philip Taylor, RHBNC

[Barry Pearson]

Philip TAYLOR [PC87S/O-XP] wrote:

Attempting to do away with all superfluous use of tables
(i.e., tables used solely for layout) on our corporate web site,
I have reached an impasse : I have one table left
(containing a single cell) which, if removed or replaced
by a <div> or <span>, causes the vertically-repeating background
image at far-left of the design to disappear.

The two variants of the page, one with and one without tables,
can be seen at
http://www.royal-holloway.org.uk/Ser...x-notable.html
and
http://www.royal-holloway.org.uk/Ser...-onetable.html

I would much appreciate any insights into why the final
table cannot be eliminated without loss of the tesselating
background image ...

I don't see the problem that you describe. (I'm not even sure what you mean).
I see different problems. The vertical blue bar on the left has clear problems
with it, in all cases. You appear to be trying to build this up in sections,
and using invalid CSS in the process. (Try validating the CSS).

IE 5 & 6 don't put the "Academic services" and "Administration" on the same
level. It drops the latter below the former. I think this is a rounding error.
Change the "50%" widths in the floated elements to (say) "49%" and the floats
may work. Whether this cures your other problems is a another matter.

The way you try to build the left hand blue bar is going to cause you
problems. For example, if I view with a very small text size, it looks OK. If
I view with large text sizes, it blows apart. I strongly suggest that you
don't try to build it by adding 125x17.png to RH-Mask-blue.png, but find
another way of doing it.

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/

[Philip TAYLOR [PC87S/O-XP]]

Barry Pearson wrote:

I don't see the problem that you describe. (I'm not even sure what you mean).
I see different problems. The vertical blue bar on the left has clear problems
with it, in all cases. You appear to be trying to build this up in sections,
and using invalid CSS in the process. (Try validating the CSS).

IE 5 & 6 don't put the "Academic services" and "Administration" on the same
level. It drops the latter below the former. I think this is a rounding error.
Change the "50%" widths in the floated elements to (say) "49%" and the floats
may work. Whether this cures your other problems is a another matter.

The way you try to build the left hand blue bar is going to cause you
problems. For example, if I view with a very small text size, it looks OK. If
I view with large text sizes, it blows apart. I strongly suggest that you
don't try to build it by adding 125x17.png to RH-Mask-blue.png, but find
another way of doing it.

Oops, you're right : I was testing with Mozilla; I now see that neither IE
nor Opera demonstrate the problem, but IE manifests a different one. The
invalid CSS is an artificat of Dreamweaver : I thought I'd eliminated
"layer-*" properties, but I see they've crept back in again. As to building
up the blue stripe, this really is the hardest part of the whole exercise;
my layering of a vertically tesellating 1px strip and appending a final
curved graphic was the only way in which I managed to achieve it at all,
but I am now thinking of trying to re-do it using one layer (DIV) for the top
stripe and another for everything beneath ...

** Phil.