Automomayorma
New Member
I am designing an online shop for client, and the product images need to be displayed in a frame, however this frame should be displayed over the image and not behind it (the image for the frame is a little squiggle thing and is not the same shape as the product image, hence why it needs to be on top - heres a link to a screen shot of the product page with the background images in the list - product page(Those little pink images need to be sitting on top of the images) Heres the CSS\[code\].product-grid{ list-style: none; margin: 0; color: {{ settings.grid_text_colour }}; } .product-grid li{ padding: 25px 5px 5px 5px; width: 190px; float: left; margin: 0 15px 10px 0; position: relative; text-align: center;background: url({{ 'squiggle.png' | asset_url }}) no-repeat;}\[/code\]is there anyway that the background image (squiggle.png) which is transparent can actually sit on top of the image which is shown in the list?any help greatly appreciated!