html - CSS スプリット、背景画像にパディングを追加

Question

私はCSSスピリットが初めてです。DIV ID のすべてのリンクに画像のような小さな赤い矢印を追加しました。こんな感じです（画像添付）

背景画像の後にパディングを取得するにはどうすればよいですか? CSSを使用して、画像とテキストの間にスペースを空けることを意味します。

CSS

#maincontent a:link {
background: url(images/css-images.png) no-repeat top left;
background-position: 0 0;
width: 4px;
height: 12px;
display:inline;
}

HTML

<div id="maincontent">
<a href="results/2013/31r09sup.php">Btech III</a>
</div>

css padding rightに追加しようとしましたが、画像の後ではなくテキストの後にスペースを与えています。

Answer 1

リンクにパディングを使用したい場合、背景はそのままですが、テキストを移動してみてくださいpadding-left: 25px;。ただし、パディングを追加すると幅が増えるため、リンクの幅を調整し、追加したパディングの量だけ減らします (この例ではそうではないかもしれません)。

また、サンプル画像が読み込まれていません

これを試して：

#maincontent a:link {
background: url(images/css-images.png) no-repeat top left;
background-position: 0 0;
width: 4px;
padding-left: 25px;
height: 12px;
display:inline;
}

Answer 2

リンクにapadding-leftまたは aを適用するだけですtext-indent