image vertical-align

Strict Standards: Static function gapiAuthMethod::getMethodName() should not be abstract in /home/zajec/domains/zajec.net/public_html/include/gapi.class.php on line 598

Strict Standards: Static function gapiAuthMethod::getTokenName() should not be abstract in /home/zajec/domains/zajec.net/public_html/include/gapi.class.php on line 605

Warning: Cannot modify header information - headers already sent by (output started at /home/zajec/domains/zajec.net/public_html/include/gapi.class.php:598) in /home/zajec/domains/zajec.net/public_html/modules/TextFiles/controller.php on line 13
image vertical-align

Bug #214019: Image with `vertical-align="top"` set inside "a" element.

Description

Inspired by problems at www.dipol.com.pl which uses vertical-align="top" in its vertical menu. Hovering menu items is erratic because image is displaced relative to the area that is hoverable.
Problem can be seen when there is:

no doctype (triggers BackComp mode)
any HTML Transitional doctype (triggers CSS1compat mode)

Can't be seen with:

<!DOCTYPE html> doctype (triggers CSS1Compat)
any HTML Strict doctype (triggers CSS1Compat)

This testcase uses <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> doctype.

Testcase

vertical-align="top" (broken?)
vertical-align="middle"
vertical-align not set - defaults to "bottom"
vertical-align="top" inside paragraph
vertical-align="middle" inside paragraph
vertical-align not set - defaults to "bottom"

Examples of case #1 with other doctypes

<!DOCTYPE HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict //EN">
No doctype
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN
"http://www.w3.org/TR/html4/loose.dtd"">

diz courtesy of zajec.net

Bug #214019: Image with vertical-align="top" set inside "a" element.

Description

Testcase

Examples of case #1 with other doctypes

Bug #214019: Image with `vertical-align="top"` set inside "a" element.