Very Basic CSS Question Regarding Images

I have a div class that has an image in it. I would like to add a padding-left:20px; to just the image in this div without affecting images in any other div tags.

What would be the style sheet tag just to style this one image only?

<div class="test">
<a href="http://www.google.com"><img src="http://www.domain.com/test.jpg"></a>
</div>

 

Well if you wanna add padding to all the images in that div just add

.test img { padding-left: 20px;}

Code (markup):

If you only want it for that image you can do either:

<img style="padding-left: 20px;" src="blahblah.gif" alt="Whatever" />

Code (markup):

Or define a class for the image like:

<img class="testing" ...">

.testing { padding-left: 20px; }

Code (markup):

 

Thanks, I did have it coded correctly when I compared to what you provided, but it wasn't working for me.

I may not have the wording down correctly, but there was a parent div that had an img tag defined.

It was the child div which I was trying to arrange the images in using a defined img tag in the child div, but wasn't working.

The child div was always taking the settings from the parent img tag. Once I removed the parent img tag, the child img tag took over and everything looked fine.

I would have thought that the child img tag would take precidence? Am I wrong in this?

 

Post your source code so we know what your problem is. Post your css as well.

 

Yes, in CSS the child inherits from the parent, but can be overwritten depending if it's a id or class. I sometimes had a problem in a few instances where a child would not overwrite something, eventhough I have defined it in that particular class and eventhough it was further down in the CSS file. Placement of the class or id in the CSS file also matters.. so would be easier to see the CSS.

 

I didn't know that, something worth remembering.