css with background image without repeating the image

Question

I have a column (lets assume the width is 40px) and there I have some rows. The height of the rows depends on the length of text (if the text is long then there is a break line and therefore the height increases).

Now I want to display an icon in each row next to the text to show the user for example that he has already completed something in that tab. So I was trying to solve this by using only css. So if the user completes a tab then I change the css of that row. However, I'm not able to add to that row an image without that the image is being repeated.

I'm using this css code:

padding: 0 8px; padding-top: 8px; padding-right: 8px; padding-bottom: 8px; padding-left: 8px; overflow: hidden; zoom: 1; text-align: left; font-size: 13px; font-family: "Trebuchet MS",Arial,Sans; line-height: 24px; color: black; border-bottom: solid 1px #BBB; background-color: white; background-image: url('images/checked.gif'); background-repeat-x: no-repeat; background-repeat-y: no-repeat; 

Does anyone know how to do that?

Answer 1

Instead of

background-repeat-x: no-repeat; background-repeat-y: no-repeat; 

which is not correct, use

background-repeat: no-repeat;