<!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">Som开发者_Python百科e 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>
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>
Change
#action-icons.img
To
#action-icons img
and check
it works for me on firefox
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
.
精彩评论