<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
#action-icons
{
float:right;
}
#action-icons.img
{
position:relative;
top:-30px;
padding-right:200px;
}
</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>
views:
58answers:
3
+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">
<html xmlns="http://www.w3.org/1999/xhtml">
<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
+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
@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
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
+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