Text-bottom in Opera [Archive] - Dynamic Drive Forums

Rain Lover

03-31-2012, 06:21 PM

Hi,

The following doesn't work in Opera:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<style type="text/css">
p {font:10pt Arial; background:green; height:16px;}
img {width:16px; height:16px; vertical-align:text-bottom;}
</style>
</head>
<body>
<p>An <img src="https://ssl.gstatic.com/images/icons/gplus-16.png" alt=""> image with a text-bottom alignment.</p>
</body>
</html>

Is it a bug or am I missing something?
Thanks!

jscheuer1

04-01-2012, 06:38 PM

Looks that way - Or Opera enthusiasts might say Opera has it right and all those others are wrong.

To my mind the text-bottom should go to the baseline formed by the font's lowest reaching descender (like the bottom of a g, q, or j (others?)). This appears to be what other browsers are doing, while Opera appears to be adding twice the height of the descender portion of the font.

In any case, in your scenario if you change the vertical-align to just bottom:

verticla-align: bottom;

Opera, IE, and Firefox all agree, and it looks like the text-bottom one did in Firefox and IE. And the 16px height on the p element is not required, at least not in the most recent versions of those browsers.

Which makes me wonder, if bottom is the same as text-bottom in those others, why bother using text-bottom?