html - Why isn't 'Vertical-align:bottom' working on this table -


this has been driving me crazy, sadly haha. can't figure out why can't make "x's" in table align bottom of table... i've tried putting vertical-align in different places in css, no avail :(. using correctly blank spots in table?

here snips of both html , css files...any comments appreciated

<html> <head> <title>day4: table king</title> <link rel="stylesheet" type="text/css" href="stylesday4.css" /> </head>  <body>  <table id="products">   <tr>   <th><span></th> <th>free version</th> <th>lite version</th> <th>full version</th>  </tr>  <tr>   <td>advertising</td>   <td id="td">x</td>   <td><span></td>   <td><span></td>  </tr>  <tr class="alt">   <td>catering software</td>   <td><span></td>   <td id="td">x</td>   <td id="td">x</td>  </tr> 

....

#products { border-collapse:collapse; width:100%; } #products th, #products td { border:1px solid #0000ff; background-color:#c0c0c0; padding:3px 2px 7px 5px; } #products th { font-size:20px; font-family:"trebuchet ms", arial, helvetica, sans-serif; color:#0000ff; padding-top:4px; padding-bottom:5px; background-color:green; } #products td { vertical-align:bottom; } #products tr { text-align:center; color:#0000ff; } #products tr.alt td { color:blue; background-color:#a7c942; } 

with html , css have provided vertical aligning seems working i'd expect. set little test on jsfiddle here http://jsfiddle.net/dttmd/ . put line breaks in first row confirm following text bottom aligning. if isn't after clarify need.

as empty cells, doing wrong since <span> elements need have closing tag. personal preference put in &nbsp; cells. don't think there "right" way though (though happy corrected).


Comments

Popular posts from this blog

asp.net - repeatedly call AddImageUrl(url) to assemble pdf document -

java - Android recognize cell phone with keyboard or not? -

iphone - How would you achieve a LED Scrolling effect? -