After successfully setting up my drag and drop game in canvas, I decided to make my canvas responsive by adding the following code to my css file:
#canvas
{
width:100%
}
However, this adjustment caused a discrepancy in my coordinates. Now, when I click on the center of an image, it no longer works as expected. Instead, I have to click near the image in order for it to register. This issue did not occur before making my canvas responsive through CSS.