IE cannot put padding on IMGs?

[delerious]

I'm trying to add some simple padding to an IMG by using a padding-right
style, but it doesn't work in IE. Works fine in Mozilla and Opera, though.

Here's a link to a page which displays this IE problem:

http://home.comcast.net/~delerious1/index12.html

I do know that I can solve the problem in IE by changing padding-right to
margin-right, but then the links cannot be clicked when the mouse is over that
margin area. So I would really like to get the padding working in IE. Any
ideas?

[delerious]

On 21 Dec 2003 09:11:01 GMT, "Evertjan." <ex************ **@interxnl.net >
wrote:

<span style="padding: 3px;"><img src=".."></span>

This solution works in IE 5.5 and 6, but not IE 5.0.

[delerious]

On Tue, 23 Dec 2003 07:44:09 GMT, de*******@no.sp am.com wrote:

On 21 Dec 2003 09:11:01 GMT, "Evertjan." <ex************ **@interxnl.net >
wrote:

<span style="padding: 3px;"><img src=".."></span>

This solution works in IE 5.5 and 6, but not IE 5.0.

Looks like I am going to have to use the really ugly solution of:

<a href="..."><img src="..."><span >&nbsp;</span>link</a>

and in the css:

span {
font-size: 0.7
}

[Steve Pugh]

de*******@no.sp am.com wrote:

On Tue, 23 Dec 2003 07:44:09 GMT, de*******@no.sp am.com wrote:

On 21 Dec 2003 09:11:01 GMT, "Evertjan." <ex************ **@interxnl.net >
wrote:

<span style="padding: 3px;"><img src=".."></span>

This solution works in IE 5.5 and 6, but not IE 5.0.

Looks like I am going to have to use the really ugly solution of:

<a href="..."><img src="..."><span >&nbsp;</span>link</a>

and in the css:

span {
font-size: 0.7
}

0.7 what?

And is it not possible to edit the image to inclue the extra space you
want? Sometimes the simplest option is the best.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net > <http://steve.pugh.net/>

[delerious]

On Tue, 23 Dec 2003 10:21:21 +0000, Steve Pugh <st***@pugh.net > wrote:

Looks like I am going to have to use the really ugly solution of:

<a href="..."><img src="..."><span >&nbsp;</span>link</a>

and in the css:

span {
font-size: 0.7
}
0.7 what?

Oh, I forgot to put in the "em" :)

And is it not possible to edit the image to inclue the extra space you
want? Sometimes the simplest option is the best.

I guess I could add in some transparent space... but then that extra space
wouldn't scale if the text size changed.

[Toby A Inkster]

delerious wrote:

span {
font-size: 0.7
}

0.7hobnobs or 0.7jaffacakes?

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

[Steve Pugh]

de*******@no.sp am.com wrote:

On Tue, 23 Dec 2003 10:21:21 +0000, Steve Pugh <st***@pugh.net > wrote:

And is it not possible to edit the image to inclue the extra space you
want? Sometimes the simplest option is the best.

I guess I could add in some transparent space... but then that extra space
wouldn't scale if the text size changed.

That is true. I was going by the example you posted in the first
message, <URL: http://home.comcast.ne t/~delerious1/index12.html> which
used padding-right: 10px;
And, of course, the images themselves won't resize if the text size
changes unless you specify their sizes in ems which is not a good idea
unless the images are very simple.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net > <http://steve.pugh.net/>

[delerious]

On Tue, 23 Dec 2003 09:57:33 GMT, de*******@no.sp am.com wrote:

On Tue, 23 Dec 2003 07:44:09 GMT, de*******@no.sp am.com wrote:

On 21 Dec 2003 09:11:01 GMT, "Evertjan." <ex************ **@interxnl.net >
wrote:

<span style="padding: 3px;"><img src=".."></span>

This solution works in IE 5.5 and 6, but not IE 5.0.

Looks like I am going to have to use the really ugly solution of:

<a href="..."><img src="..."><span >&nbsp;</span>link</a>

and in the css:

span {
font-size: 0.7
}

I have a better solution now involving conditional comments in IE:

<a href="..."><spa n style="padding-right: 0.3em"><img src="..."></span>
<!--[if IE 5.0]><span>&nbsp; </span><![endif]-->link</a>

Of course I can't verify that this works right now as I'm encountering that
multiple IE installation version number problem, but I'm pretty sure it will
work. (famous last words, I know!)

[SwissCheese]

<de*******@no.s pam.com> wrote in message
news:3f******** *******@news.md .comcast.gigane ws.com...

On Sun, 21 Dec 2003 13:39:25 GMT, "SwissChees e" <Sw*********@cf l.rr.com>
wrote:

The problem lies in trying to make the A element display as BLOCK while
including an image as part of the link. See my previous examples from yourother questions. There are better answers i'm sure but I get identicle
output in both IE6 and Mozilla, Opera is another story...

Thanks for the replies, SwissCheese.

Maybe you could wrap the IMG in a <p> element?