<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB2312" /> <title>Untitled Document</title> <mce:style type="text/css"><!-- .outer { height: 250px; width: 240px; overflow: hidden; position: static !important; position: relative; display: table !important; border:1px solid #FF0000; } #middle { /* for explorer only*/ position: absolute; top: 50%; } #middle[id] { display: table-cell; vertical-align: middle; position: static; } #inner { /* for explorer only */ position: relative; top: -50%; width: 100%; margin: 0 auto; text-align:center } li{ list-style:none; float:left; margin:2px 5px; } --></mce:style><style type="text/css" mce_bogus="1"> .outer { height: 250px; width: 240px; overflow: hidden; position: static !important; position: relative; display: table !important; border:1px solid #FF0000; } #middle { /* for explorer only*/ position: absolute; top: 50%; } #middle[id] { display: table-cell; vertical-align: middle; position: static; } #inner { /* for explorer only */ position: relative; top: -50%; width: 100%; margin: 0 auto; text-align:center } li{ list-style:none; float:left; margin:2px 5px; } </style> </head> <body> <ul> <li> <div class="outer"> <div id="middle"> <div id="inner"><img src="http://www.javaeye.com/images/user-logo.gif" mce_src="http://www.javaeye.com/images/user-logo.gif" alt="" /></div> </div> </div> </li> <li> <div class="outer"> <div id="middle"> <div id="inner">fdskfjdskfjds</div> </div> </div> </li> </ul> </body> </html>