CSS and Images Question

[TerryMc]

I've got a few image questions when using CSS.
I use a 1x1.gif "dot" image for spacing and lines, is this the correct way to call it using CSS?

------------
img.dot {
height: 1px;
width: 97%;
background: url('http://www.domain.com/images/1x1.gif');
}

<img class="DOT">

------------

I've also got an image that is 11px x 11px, I call this image a lot on my site, so I would like to call it similar to above, so I did this:

img.close {
height: 11px;
width: 11px;
border:none ;
background: url('http://www.domain.com/images/close.gif');
}

<img class="close">

However, when I do this I the image always shows up in a small little box.

Thanks for your help!

[ShawnR]

Hi Terry

For both qns, the answer is: 'Its a mindset thing. When you think about CSS, don't think "this is nifty to avoid code repetition". Instead think "this is nifty to separate content from form".

To be less cryptic:

Using CSS should mean that you don't have to worry about using 1px invisible images to space out table cells to position things. You just position them using CSS.

Your 2nd qn: The image (the close button) is part of your content. It is not a bit of background graphic to the content. The <img> tag needs to have a path/url to an image in it

Edited: (Oops)