Bug 22050 – overlapping of header image and links

• Component: New Bugs
• Status: NEW

[jasneet]

I Steps:
Go to http://www.spaziomotori.it/Contratti_auto_moto.htm

II Issue:
overlapping of header image and links 

III Conclusion:
Code for quick reference:
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr><td>
<p><img src="" alt="" align="left" border="2" width="400" height="80" hspace="0"></p>
<div align="left">
	<table bgcolor="#ffcc66" border="2" cellpadding="0" cellspacing="1" 
width="57%" height="60">
		<tbody><tr>
			<td colspan="5" height="15">
			</td>
		</tr>
	</tbody></table>
</div>
</td></tr></tbody></table>

Issue is due to <p> tag. 
<p> tag outside image tag does nothing in IE, shifts the table a little down in FF 
and moves the table to left in Safari/Chrome. Removing paragraph tag solves the 
issue.

IV Other Browsers:
IE7: ok
FF3: ok

V Nightly tested: 37819

[jasneet]

Created attachment 24860 [details]
reduced testcase

[Jon@Chromium]

Originated in Chromium bug tracker: http://code.google.com/p/chromium/issues/detail?id=1271

[Ahmad Saleem]

All three browsers differ in behavior:

*** Safari Technology Preview 152 ***

Yellow / Pale color container is above other box and matching half-way

*** Chrome Canary 107 ***

Yellow / Pale color container is matching top border with each other on y-axis 

*** Firefox Nightly 106 ***

Yellow / Pale color container is center of other container and does not match from top border or bottom border

_________

I am going to change status to "New" so someone can confirm which browser beahvior is correct or aligned with web-spec. Thanks!

[Radar WebKit Bug Importer]

<rdar://problem/99295700>