css border dotted ile alakalı sorun var

Merhabalar,

aşağıdaki resimde gösterildiği gibi fiyat ile ürün arasında birden fazla nokta işareti koyarak yapıyorum. fakat ürün adının uzunluğu artınca fiyat ve noktalar aşağıya kayıyor. bunu engellemek için ise border dotted kullanayım dedim fakat with değerini 100% verdiğimde yazıların altını da kaplıyor. bunun için önereceğiniz bir çözüm var mıdır?

aklıma gelen: ::after metodu ile birşeyler deneyebilirsiniz. misal;

.divismi::after{ width: 100%; } gibisinden. hani oldugu yeri doldursun zaten sağ tarafına fiyat geliyor vs. tam anlatamadım ama aklıma gelen budur

Yazıya background verebilirsiniz.

Divler ikiye ayrılacak ve soldaki float: left sağda ki de float: right alacak, sağda ki sola doğru genişleyecek ve ilerledikçe notkaları kapatacak, bunun için sağdakinin aynı zamanda beyaz bir arkaplan alması gerekir tabi, birkaç px'de padding