I need to align an image to the bottom of a div whose height is set by percentage, but I know that "vertical-align: bottom" isn't right for this case. I use this template:
---------------------------------------------------------- <?xml version="1.0" encoding="iso-8859-1"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Strict.dtd";> <html> <head> <title>Vertical align in a DIV</title> <style type="text/css"> html, body { height: 100%; } #area { width: 140px; height: 80%; border: 1px solid black; } </style> </head> <body> <div id="area"> <img src="img/test.png" alt="img" width="100" height="100" /> </div> </body> </html> ---------------------------------------------------------- [Thanks to David Baron for the html, body { height: 100% } :) ] At present I am using a workaround (a table with valign="bottom") but I want to be fully compliant with XHTML, so how can I do it? Thank you in advance! Max
