Converting very old html to html5 + css - inexplicable difference

[Robert Prins]

This

<https://prino.neocities.org/@temp/$marty/old.html>

is the old html, and

this

<https://prino.neocities.org/@temp/$marty/new.html>

is the new html5+css (and is very much Work-in-progress)

As for the why, I'm trying to create some REXX code to actually, I've got four
more of these files, one of 9,000+ lines, to convert, do the conversion
automatically, but for that I need a reference.

My "problem" is that in "new.html" the text after the third picture is shifted
to the left, and I cannot figure out why this is happening, so if anyone here
has any clues, please share them!

And yes, I know there are differences in the line-spacing, but those are (at
least for now) not very interesting, I surmise that some of them might be caused
by using a class on the <p> tag, rather than adding a additional <span>..</span>
with the class.

Thanks,

Robert

[Stan Brown]

Post by Robert Prins
My "problem" is that in "new.html" the text after the third picture is shifted
to the left, and I cannot figure out why this is happening, so if anyone here
has any clues, please share them!

A run through the w3c validator shows numerous nesting errors. (There
are also a lot of errors and warnings about obsolete things, but I
know you plan to take care of those.)

<https://validator.w3.org/nu/?doc=https%3A%2F%2Fprino.neocities.org%
2F%40temp%2F%24marty%2Fnew>

[Robert Prins]

Post by Stan Brown

Post by Robert Prins
My "problem" is that in "new.html" the text after the third picture is
shifted to the left, and I cannot figure out why this is happening, so if
anyone here has any clues, please share them! >

A run through the w3c validator shows numerous nesting errors. (There
are also a lot of errors and warnings about obsolete things, but I
know you plan to take care of those.)
<https://validator.w3.org/nu/?doc=https%3A%2F%2Fprino.neocities.org%
2F%40temp%2F%24marty%2Fnew>

Old,

<https://prino.neocities.org/@temp/$marty/old.html>,

and

new,

<https://prino.neocities.org/@temp/$marty/new.html>

now match 99.999%, I've got a tiny, no pun intended, problem with the size="2"
font, size=2 and font-size: 81.0% are obviously not the same, but life's way too
short to figure out the decimals.

The new.html now validates without errors on <https://validator.w3.org/nu/>, the
old.html validation results in 380 messages, most, 372, about obsolete elements
and attributes, I've manually removed the ones that caused the nesting errors.

I've also written a small REXX exec, just 72 lines of code, that almost converts
the next file from the old "legacy-html" to html5, but here I've run into a snag
that I cannot explain...

So I added a bit of temporary CSS to show the table borders, and then had a look
at the "new.html" in FF's Inspector window. Much to my surprise, the computed
table-width is 625.133px (where the CSS specifies 400px), and its contents only
start moving one the width goes over 626px. (The inspector doesn't tell me
anything about "old.html", which is a bummer...)

So here is the first question,

*** "Where does the calculated width of 625.133px come from?" ***

The table contains only pure text, and I would have expected that too long lines
would simply wrap to the next line, but apparently not...

Robert

[Jukka K. Korpela]

Post by Robert Prins
I've got a tiny, no pun intended, problem with the
size="2" font, size=2 and font-size: 81.0% are obviously not the same,
but life's way too short to figure out the decimals.

I have no idea why you are converting old documents to new format,
but maybe there is a reason. If you just keep the documents on the web
and make some updates and additions, I don't see why you would not work
with their existing HTML and CSS code. If you want to make a major
revision, it is probably faster and better to design new templates and
start with them, just copying content from old documents as needed.

But the specific problem you mention looks simple to me: the values
of the size attribute of the <font> element was meant be numeric values
from 1 to 7, corresponding to an implementation-defined set of font
sizes, in increasing order. Specifically, <font size=2> corresponds to
font-size: small in CSS, as explicitly described at
https://html.spec.whatwg.org/multipage/rendering.html#phrasing-content-3

Yucca, https://jkorpela.fi

[Robert Prins]

Post by Jukka K. Korpela

I've got a tiny, no pun intended, problem with the size="2" font, size=2 and
font-size: 81.0% are obviously not the same, but life's way too short to
figure out the decimals.

I have no idea why you are converting old documents to new format,
but maybe there is a reason. If you just keep the documents on the web
and make some updates and additions, I don't see why you would not work
with their existing HTML and CSS code. If you want to make a major revision, it
is probably faster and better to design new templates and
start with them, just copying content from old documents as needed.

I do it because I have too much time on my hands, and as I wrote, I've written a
bit of REXX to almost completely automate the conversion, so I'm hitting two
birds with one stone, I make the content more easily (not via archive.org)
available again on a site that tries to collect as much hitchhike material as
possible, Bernd Wechner has indicated that he no longer has the time to keep his
<https://bernd.wechner.info/Hitchhiking/> site up-to-date, and I keep my grey
cells active during those times that I'm not working on my other hitchhike
statistics programs and an ongoing discussion to see if it's possible to define
an DTD to define hitchhiking data recorded by various hitchhikers, who now all
use their own totally incompatible formats.

Anyway, there are still a few loose ends to tidy up in the REXX exec, like
processing <font> tags with multiple attributes, but I'll iron these out once
I'm back from hitchhiking to the Netherlands (later this week) and back to
Lithuania again (early next week), and if you ask why? My father has Alzheimer.

Post by Jukka K. Korpela
But the specific problem you mention looks simple to me: the values
of the size attribute of the <font> element was meant be numeric values
from 1 to 7, corresponding to an implementation-defined set of font sizes, in
increasing order. Specifically, <font size=2> corresponds to
font-size: small in CSS, as explicitly described at
https://html.spec.whatwg.org/multipage/rendering.html#phrasing-content-3

That seems to solve the issue, well almost, as using these "textual" sizes
correct the font, but there's still flutter in the line-spacing, with "small",
the line-spacing is visibly larger than with size=2, but, as I already
mentioned, that is not my problem, which is the much wider calculated size of
the table compared to the specified size.

Robert