Question

How can I set the vertical alignment while using ‘ul’ and ‘li’?

Here every font are the same height and same width, so it’s hard to explain.
Please see the table below.
Now there is a table about tag cloud.

The tags are actually different sized and the bottom alignment of ‘tags:’ in is the same alignment as the top of the largest sized tags.

I want the opposite. the bottom alignment of the largest tags should be the same as the bottom alignment of tags: in .

Is it possible?

Output table

th    td

tags: Apple Banana Strawberry Melon Orange Mango 
      Kiwi Pineapple grapefruit 

UPDATE:

I made DEMO http://jsfiddle.net/vrqe5/

Please take a look at that.

I want to set the bottom alignment the same.
I mean the bottom aligngment of character tags: and very 1st line of li tags words.

Answer 1

not sure about your code, but you can try…

.yourTagClass{
   display: table-cell;
   vertical-alignment: bottom; //or text-bottom
 }

As per your demo, try these styles

 div.weekly_tag tr{
    display:table-row;
    vertical-align:text-bottom;
 }

 div.weekly_tag th.tag_title{
    width:90px;
 }

 div.weekly_tag th.tag_tags{
    line-height: 25px;
    text-align:left;
 }

 div.weekly_tag li{
    display:inline;
    white-space:nowrap;
 }