ansaurus

Question

Answer 1

+2 A:

Try adding:

#action-icons.img
{
    position:relative;
    top:-30px;
    padding-right:200px;
}

Might do it.

Edit: You have #action-icons.img remove the dot so it's #action-icons img.

The dot sets img up as a class, so as you have it, the HTML would look like:

<img src="bar.png" width="60" height="60" alt="" id="trash" class="img"/>

Hope it helps.

Edit - Here is the full working code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; 
<html xmlns="http://www.w3.org/1999/xhtml"&gt; 
<head>
<style type="text/css">
#action-icons
{
    float:right;
}
#action-icons img
{
    position:relative;
    top:-30px;
    margin-left:50px;
}
</style>
</head> 

<body> 
    <h1 class="edit">Some nifty title
    <span id="action-icons"> 
    <img src="foo.png" width="64" height="64" alt="" id="newsticky"/> 
    <img src="bar.png" width="60" height="60" alt="" id="trash"/> 
    </span> 
    </h1> 
</body> 
</html>

Kyle Sevenoaks 2010-04-30 07:49:05

It doesn't work.

ripper234 2010-04-30 07:53:20

Thanks, now it does :)

ripper234 2010-04-30 07:58:12

Heh, it turns out the inline wasn't needed, the problem was just my the selector.

ripper234 2010-04-30 08:01:27

Fair enough, took me a while to see the selector anyway :)

Kyle Sevenoaks 2010-04-30 08:04:04

Answer 2

+2 A:

Try margin-right

and use

#action-icons img

to address the image.

#action-icons.img

means "any element with the ID action-icons and the class img.

Pekka 2010-04-30 07:49:16

It doesn't work.

ripper234 2010-04-30 07:52:09

@ripper additionally, use `img#action-icons` instead of `#action-icons.img`. As it stands, the rule doesn't get applied.

Pekka 2010-04-30 07:53:21

I didn't copy! :)

Kyle Sevenoaks 2010-04-30 07:55:40

Your answer still didn't work ... @Kyle's did the trick. Thanks for the effort.

ripper234 2010-04-30 07:58:50

@Pekka: Unless I'm mistaken, `img#action-icons` would match any img with the id 'action-icons', though. You want `#action-icons img` - any image that is a descendant of a node with the id 'action-icons'.

pinkgothic 2010-04-30 08:00:11

@pinkgothic you're right of couse. D'oh! Corrected, thanks.

Pekka 2010-04-30 08:01:28

Answer 3

+2 A:

Change

#action-icons.img

To

#action-icons img

and check

it works for me on firefox

Salil 2010-04-30 07:57:33

ansaurus

tags:

views:

answers:

Padding between images doesn't pad

related questions