Weird things about vertical spacing in HTML

Liam Gibbs

Hello everyone,

I'm having trouble figuring out a problem with a page I'm looking at:
http://www.international.gc.ca/fac/p...4.aspx?lang=en.
Quite obviously, my problem is that the main content of the page
appears right below the left menu, not beside like it should. I've
been able to correct this problem by removing all EM tags. Also, I'm
using Interwoven, and for those who are familiar, unclicking the "Wrap
content around right column" option also corrects the problem. But
neither of those is a good solution, because both are needed. Anyway,
the French version works fine (at http://www.international.gc.ca/fac/p...4.aspx?lang=en)
and the only difference in the coding is that it uses no EM tags.

I'm using IE 6.0 on Windows XP, if that matters. Maybe it's a bug in
IE? I don't know. Unfortunately, I don't have administrator privileges
so I can't install other browsers and test the page in them. Maybe
it's a combination of the EM tag and the "right column" option. Maybe
it's Interwoven. I don't know. Unfortunately a ton of the code is
stored in places I can't touch, so cleaning it up to figure things out
is impossible (and the code is a MESS).

Incidentally, I'm getting the same problem in
http://www.international.gc.ca/fac/p...e.aspx?lang=en
and http://www.international.gc.ca/fac/p...e.aspx?lang=fr
(this time the French has problems and uses EM tags). Removing the
"Wrap content around right column" option also works with these pages.

Thanks.

Mar 6 '08 #1

Liam Gibbs

Anyway, the French version works fine (athttp://www.international.gc.ca/fac/polar-polaire/final4.aspx?lang=en)

Sorry. That link should be http://www.international.gc.ca/fac/p...4.aspx?lang=fr.

Mar 6 '08 #2

John Hosking

Liam Gibbs wrote:

I'm having trouble figuring out a problem with a page I'm looking at:
http://www.international.gc.ca/fac/p...4.aspx?lang=en.
Quite obviously, my problem is that the main content of the page

Actually, it is not obvious at all.

appears right below the left menu, not beside like it should. I've
been able to correct this problem by removing all EM tags.

Surprising to me, for such long strings of content. For narrower blocks
with tightly constrained sizes, making text italic or bold can sometimes
cause it to exceed its provided width. I don't see how that's happening
here, though.

[more observations snipped]

>
I'm using IE 6.0 on Windows XP, if that matters.

It does, absolutely. The pages look fine in Firefox, for example.

Maybe it's a bug inIE? I don't know.

Maybe. I can't tell, either.

Unfortunately, I don't have administrator privileges
so I can't install other browsers and test the page in them.

If you are supposed to be a site administrator or developer, you need to
get those privileges, or someone who has, or you can't do your job.
Testing with IE6 only is just silly.

Maybe
it's a combination of the EM tag and the "right column" option. Maybe
it's Interwoven. I don't know. Unfortunately a ton of the code is
stored in places I can't touch, so cleaning it up to figure things out
is impossible (and the code is a MESS).

I don't know what the expression is in Canada, but where I come from, we
say "you're screwed."

Ten or more different stylesheets (not all correct), JavaScript with
browser-sniffing, and huge amounts of code (in two languages) all
combine to scare me away from helping on this. Maybe a reduced version
of the pages would be debuggable, but I understand you can't provide
that, so I can't help. So sorry.

--
John
Read about the UIP: http://improve-usenet.org/
I keep forgetting.

Mar 7 '08 #3

John Hosking

John Hosking wrote:

>
I don't know what the expression is in Canada, but where I come from, we
say "you're screwed."

Oh, I was right: this is in one of the stylesheets (base2.css):

body, p, blockquote, table, td, th, li, a, ul, ol, input, dd, dl, dt,
form, input, button, textarea, select, option, fieldset, label {
font-size: 100%;
}
select, input, textarea, code, code span {
font-size: 100%;
}
body {
font-size: 80%;
}
..fontSize200 {
font-size: 200%;
}
..fontSize195 {
font-size: 195%;
}
etc.
while this is in base.css:

body, p, li, div, span {
font-family: Verdana, Arial, Helvetica, sans-serif;
}
body, p, blockquote, table, td, th, li, a, ul, ol, dd, dl, dt,
form, button, fieldset, label, select, option, input, textarea {
font-size: 10.0pt;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
You are most definitely, totally, royally screwed.
--
John
Read about the UIP: http://improve-usenet.org/

Mar 7 '08 #4