159928 - [FLOAT]{inc}Floating image is not correctly position

Status: RESOLVED WORKSFORME

(Core :: Layout, defect)

Description

[Masayuki Nakano [:masayuki] (he/him)(JST, +0900)(sickish, maybe slower respose)]

Go to http://www.tinami.com/
You will find floating image under "tinamix".

Does this image overlap on Text?
If this image doesn't overlap text, push F5 key several times.
You will see this image overlaped on text.

I reproduced on 2002072808-trunk/WinXP.

This problem came from Bugzilla-jp
http://bugzilla.mozilla.gr.jp/show_bug.cgi?id=1169

But this page on local hard drive, I can't reproduce this problem.

#screenshot(with "*{border: black solid 1px;}" in userContent.css)
http://bugzilla.mozilla.gr.jp/showattachment.cgi?attach_id=293

Comment 1

[Niklas Dougherty]

Remove or experiment with the HSPACE=8 entity in the following tag: <img
SRC="img/tinamix_sample.gif" ALT="SAMPLE" ALIGN="left" BORDER="0" WIDTH="40"
HEIGHT="80" HSPACE=8>, and it'll work. Add margin-left and margin-top
definitions to place the pic correctly.

This is not a bug, but a coding problem. Check your margins definitions. (I'd
advice making the document conformant to HTML 4 Strict and get rid of all font
tags and align attributes in favor of clean CSS.)

Comment 2

[Masayuki Nakano [:masayuki] (he/him)(JST, +0900)(sickish, maybe slower respose)]

Yes, I know this site coding has many problems.
But I can't reproduce this problem on HDD.
And changed layout when the page reload, same HTML file on web.
I think the layout changed is bug. not site coding problem.

Comment 3

[Niklas Dougherty]

OK, I have a better idea: Put quotes around the attribute (HSPACE) value (="8",
*not* =8). This is not required, so to speak, by old style pages, but is
nevertheless recommended. Other values in the code are quoted.

Thus, change <img
SRC="img/tinamix_sample.gif" ALT="SAMPLE" ALIGN="left" BORDER="0" WIDTH="40"
HEIGHT="80" HSPACE=8> to <img
SRC="img/tinamix_sample.gif" ALT="SAMPLE" ALIGN="left" BORDER="0" WIDTH="40"
HEIGHT="80" HSPACE="8">. Works perfectly (Mac OS X, and by assumption all
platforms).

Comment 4

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

The screenshot makes this look like a perfectly valid bug.

Comment 5

[Niklas Dougherty]

Attachment: Bad and good rendering

Well, the bug is pertaining to quoted attribute values. I get the same
overlapping when the relevant image has the attribute HSPACE=8. However, if I
download the site and change this to HSPACE="8", it renders as intended. See
attachment. This is on Mac OS X, but I beleive this will hold on WXP as well.

Comment 6

[Masayuki Nakano [:masayuki] (he/him)(JST, +0900)(sickish, maybe slower respose)]

I can't reproduce with 2002082404-trunk/WinXP.

-> WFM