fillText renders blurry text when canvas dimensions defined in CSS but renders sharp, defined text when dimensions defined in HTML. Why?

Question

I have a canvas that uses fillText to display something. I originally defined the dimensions with CSS, and the text displayed very blurry, so I looked around and saw posts about pixel ratios and stuff. This wasn't the issue, however, as there was another canvas on the same page that was displaying everything nicely. Looking through the differences between the two, I noticed that the one with issues had its dimensions defined in CSS whereas the other had it defined in the HTML canvas tag. I tried changing the faulty one to do the same, and it worked, but I do not understand why.