Currently faced with the following issue:
I am attempting to add an image to my webpage, but it must be centered and not draggable. When I click on it, I do not want it to move. To achieve this, I have created a div:
<div id="products_logo"></div>
Along with a corresponding css file:
.products #products_logo{
background: url('../img/shop.png') no-repeat center center;
}
As a result, two images of a shopping cart are being displayed - one in its original position (drag-able) and another at the center (not drag-able). Also, while we're here, is it more appropriate to use a div as an ID or a class? Could someone direct me to a page that explains the differences?
Thank you!
Here is some additional HTML code as requested:
<div class="products">
<div id="products_logo"></div>
<h1>Our Products</h1>
<div class="products_table">
<table>
<tr>
<td id="ti1">item1</td>
<td id="ti2">item2</td>
<td id="ti3">item3</td>
</tr>
<tr>
<td id="ti4">item4</td>
<td id="ti5">item5</td>
<td id="ti6">item6</td>
</tr>
</table>
<div>
</div>
Apologies for the formatting errors with the code tags.