W3C home > Mailing lists > Public > www-style@w3.org > December 1996

Re: vertical-align (5.4.4)

From: Jim King <jimk@mathtype.com>
Date: Thu, 12 Dec 1996 17:23:03 -0800
Message-Id: <>
To: Hakon Lie <howcome@w3.org>
Cc: www-style@w3.org, dsr@w3.org
> > The code I am using (within paragraph text) is:
> > 
> > <IMG STYLE="vertical-align: -20%" SRC="equation.gif">
> > 
> > Does this code look reasonable? 
>Yes it does. Your example will lower the image relative to the
>baseline of the parent element. It will move a distance equal to 20%
>of the 'line-height' property (which most often will be 20% of the
>line height of the line the image forms a part of).
>Unfortunately, there are no known implementations of 'vertical-align'
>yet. That should change within a few months.

Thanks. In reading the section on line-height, I'm not completely clear on
what happens with a line that has multiple inline elements (such as three
gifs of equations in one line.)  Would that % be 20% of the overall line-box
plus the leading, or would it be 20% of the line-height ONLY at the point
where the image is located (which is different from the line-height 2
characters earlier)?  4.4 seems to imply that the line is sectionalized such
that the latter would be the case. If so, does that mean that for any
in-line object that I want to align with text I should set: height, width,
line-height, leading, and vertical-align?

Seems to me that there should be some way to set the vertical alignment in a
way that references back to the object I'm aligning.  So I should be able to
say "20% drop" in a way that says I am dropping by a distance that is 20% of
the object itself's height (which I have control over) rather than 20% of
the height of the items around the object (whcih I don't usually have
control over). 

The specific situation I'm thinking of is math equations.  If I want to put
the following into a web page:
        2             3y 
If x=------- then y=-------.
       3y              1

then I need a way to drop each math expression by a set distance below the
baseline.  Each equation has a different distance that is dependent on
nothing except for the contents of the expression. That distance can't be
based on the overall line-height, because that can change in too many ways.
The only thing that doesn't change (and thus is the rock on which I can base
my vertical alignment) is the height of the equation itself.  Now if
'vertical-align' is based on a line-height that is actually the height of
the image + the leading then that's a bit better, but since the 'cascade'
aspect of CSS allows a user to have changed the leading value on their own
machine, there is the strong posibility that any guess I've made about the
leading value will be wrong.  

What I really want to say is "Here is the baseline point of the image
itself.  Line it up with your baseline."  That is only said if the value is
a reference to the object.

I havn't found a way to do this with the current spec, but perhaps I've
missed something. Is there a better style element to use for this?

I'm fairly new to the www-style list, so maybe this has been discussed
before - do you know approximately when 'vertical-align' was added so that I
can go back through the archived copies to find what concerns were brought
up before?

Jim King
Product Manager

Design Science, Inc.            Sales:   sales@mathtype.com
4028 Broadway                   Support: support@mathtype.com
Long Beach, CA 90803            
USA                             World Wide Web: 
voice: 310-433-0685                 http://www.mathtype.com
fax: 310-433-6969
Received on Thursday, 12 December 1996 20:24:03 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:26:42 UTC