The vertical-align style property looks at everything on the current line, including both text and images. It then looks at the height of the text boxes or images, and aligns the object with the tallest item on the line. For example, the text in this HTML would be aligned at the top of the line formed by the initial image:
<p> <img src="" style="height:50px; width:10px; border:solid black 1px;" /> <span style="vertical-align: top; font-size: 12pt;">The quick brown fox...</span> </p>
You can see how the different values of the vertical-align style property work online.
But the answer to Bryden’s question is more complicated. While it isn’t possible to use the vertical-align style property to create vertical text using CSS, CSS3 provides a solution.
Posted in: CSS