I was playing around with displaying an image via img src in HTML and background in CSS. I did this:
#image_id{
width: 45px;
height: 45px;
background: url(/*insert location of image here*/);
}
The result was the image displayed two times and appeared to be trying to display a third time, except that it was partially blocked by another image. I didn't have this problem using img src in HTML. Why?
Because background causes the image to repeat. The solution is to add:
background-repeat: no-repeat;
There is also the option of having the image repeat on the x-axis or y-axis only.
I make no representation as to the validity or desirability of using background instead of img src. I do, however, hope to save someone a little time when they start going batty trying to figure out where in their code they made the image appear twice when they use background. Happy cascading!
No comments:
Post a Comment