CSS Forum

**Boar** · 01-02-2008, 04:36 PM

I have been a bit confused lately...

<img src="http://www.webmaster-talk.com/images/e-1.jpg height="170" width="250" id="eimage" />

When I use this: #eimage { padding: 20px 30px 20px 30px; } it works.

<img src="http://www.webmaster-talk.com/images/e-1.jpg height="170" width="250" class="eimage" />

But it does not work as a Class, ex: .eimage { padding: 20px 30px 20px 30px; } Only this works as a class: .eimage {padding: 20px;}

Why is this? I would like to use it on multiple image elements, so I cannot use an ID.

**LadynRed** · 01-02-2008, 10:40 PM

Looks like a specificity issue. Have to see the rest of the code to know for certain.

**Boar** · 01-04-2008, 05:50 PM

Well that is all of the code - so Im not sure.

I am using dreamweaver and safari to view this too - don't know what would happen in IE, but the changes show up in dreamweaver.

**frost** · 01-04-2008, 06:21 PM

Other than the missing quote, both examples work for me.
<img src="http://www.webmaster-talk.com/images/e-1.jpg" height="170" width="250" id="eimage" />

Are you sure that you don't have more CSS?

**Boar** · 01-23-2008, 10:56 AM

I would really like to figure this out, ran into this problem again today.

For some reason when I make a class: .text {padding: 20px; } something like that - won't work when I apply it to the text. however if I make it like this #text {padding: 20px; } and apply it with a div, then it works.

Can you not add padding to .classes?

**LadynRed** · 01-23-2008, 11:05 AM

Of course you can. The issue is SPECIFICITY. Without seeing ALL your HTML and CSS, there's no way to know what is taking precedence.

Where .text{padding: 20px;} is certainly valid, if that text is inside a div, then your css may have to look like this:

#main .text{padding: 20px;}

http://www.htmldog.com/guides/cssadvanced/specificity/

**Boar** · 12:36 PM

Well I am not using any div tags so there shouldn't be any issues.

here is a little sample I made, only the left padding works, there should be 100px padding all around - I added a margin and it still doesnt work. I am trying to get top padding.

Code:

<html>
<head>

<style type="text/css">
.text {padding: 100px; margin-top: 100px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #0000FF;}
</style>

</head>

<body>



<table width="294" border="0" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr>
    <td width="294" height="138" valign="top">
	
	<span class="text">this is a word</span>
	
	</td>
  </tr>
</table>
</body>
</html>

**LadynRed** · 01-23-2008, 03:48 PM

Quote:

Well I am not using any div tags

That's your FIRST problem, you shouldn't be using tables for layout.

The problem is THE TABLE !

If you insist on using the table, you're going to have to do it this way:

Quote:

I put in the yellow background so you could see what's happening.

**mediarefined** · 01-24-2008, 01:09 AM

I think you could also apply the padding to your table cell instead of the paragraph