Problema com DIV

Bom galera.. estou com um problema, quero fazer com que o tamanho da li, seja o mesmo em todas, sem ter que pré definir um tamanho, como no site do Walmart. Peço ajuda de vocês, obrigado.

CSS :

#content .offer {width:766px; overflow:hidden; float:right;}
#content .offer ul {margin-top:10px; padding:0;}
#content .offer li {padding:10px; margin-left:5px; border:1px solid #FFF; width:160px; float:left; text-align:center;}
#content .offer li:hover {border:1px solid #CCC;}
#content .offer a:hover {text-decoration:underline;}
#content .offer h2 {font-size:13px; color:#484848; font-weight:lighter;}
#content .offer h3 {font-size:12px; color:#484848;}
#content .offer b {font-size:15px; color:#006;}
#content .offer .ofOffer {font-size:11px;}
#content .offer .ofOffer b{text-decoration:line-through; color:#D23939; font-size:12px}

HTML :

<div class="offer">
 <ul>
 <li><a href="" title="Oferta">
 <h2>Notebook Qbex Intel® Core™ i5, MS-1454, 2GB, HD 500GB, 14", Webcam, HDMI, Wireless – Linux</h2> <img src="{$url}imgs/oferta.jpg" alt="Oferta" />
 <h3>Por: <b>R$ 90,90</b></h3></a>
 </li>
 <li><a href="" title="Oferta">
 <h2>Câmera Digital Sony Semi-Profissional DSC-H55/B 14.1MP, Zoom Óptico 10x, Foto Panorâmica, LCD 3", Estabilizador Óptico,Vídeo HD, Bateria Recarregável</h2> <img src="{$url}imgs/oferta.jpg" alt="Oferta" />
 <h3>Por: <b>R$ 90,90</b></h3></a>
 </li>
 <li><a href="" title="Oferta">
 <h2>Oferta 1</h2> <img src="{$url}imgs/oferta.jpg" alt="Oferta" />
 <h3>Por: <b>R$ 90,90</b></h3></a>
 </li>
 <li><a href="" title="Oferta">
 <h2>Oferta 1</h2> <img src="{$url}imgs/oferta.jpg" alt="Oferta" />
 <div class="ofOffer">de: <b>R$ 190,90</b></div>
 <h3>Por: <b>R$ 90,90</b></h3></a>
 </li>
 </ul>
 </div>