开发者

html css image alignment

I have a question regarding image alignment with CSS. For example I have created a css class as below:

.link {
 background: url("images/image1.gif") scroll right;
}

and below is the markup

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Untitled Document</title>
        <p class="link">This is a link</p>
    </head>
    <body>
    </body>
</html>

When I check in the brows开发者_Go百科er I get the image on the text. I want it after the text i mean

This is a link (this is where I want the image to appear)


Try

.link {
  background: url("images/image1.gif") top right no-repeat;
  padding-right: 32px; /* or the width of your image */
}


Not sure if I understand right, but assuming you trying to display image right after text ends you might try something like that:

.link {
       background: url("images/image1.gif") scroll right;
       padding-right: 20px; /* adjust to fit nicely with your design */
}

hope it helps :)


shouldn't it be position right not scroll right? You can also give the link text some padding to clear the background picture.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜