Arredondamento de borda usando ul e com imagem

Depende, mestre fyoda, de como você quer fazer. Poste uma imagem do resultado final que espera.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

http://img706.imageshack.us/i/imglx.jpg/

Tente assim:

HTML

<ul class="product">
 <li>...</li>
 <li>...</li>
 <li>...</li>
 <li>...</li>
 <li class="bgFooterUL"></li>
</ul>

CSS

.product{
 background: url(bgTop.jpg) no-repeat 0% 0%;
 position: relative;
 list-style: none;
 [...]
}
.bgFooterUL{
 background: url(bgBottom.jpg) no-repeat 0% 0%;
 position: absolute;
 bottom: 0;
 left: 0;
 height: 20px; /* Altura da imagem */
}

Onde bgTop.jpg é um slice da imagem que vai do lado esquerdo até o direito da parte superior, englobando apenas a parte que tem arredondamento.

O bgBottom.jpg é a mesma coisa do bgTop.jpg, porém a parte inferior.

Seria algo assim:

/applications/core/interface/imageproxy/imageproxy.php?img=http://brasilpiacava.com.br/images/backgroundTopForm.png&key=da18ed765c2ceb5100413b168ac84d6e1990d6ed5271610116575c8f316f209d" alt="Imagem Postada" />

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

P.S.: Não vejo isso como um ul...