CSS Hintergrundbild in: nach Element

Ich versuche, erstellen Sie ein CSS-button und fügen Sie ein Symbol, um es mit :nach, aber das Bild wird nie angezeigt. Wenn ich ersetzen die 'background' - Eigenschaft mit 'background-color:red' dann ein rotes Feld erscheint, so bin ich nicht sicher was ist falsch hier.

HTML:

<a class="button green"> Click me </a>

CSS:

.button {
padding: 15px 50px 15px 15px;
color: #fff;
text-decoration: none;
display: inline-block;
position: relative;
}

.button:after {
content: "";
width: 30px;
height: 30px;
background: url("http://www.gentleface.com/i/free_toolbar_icons_16x16_black.png") no-repeat -30px -50px no-scroll;
background-color: red;
top: 10px;
right: 5px;
position: absolute;
display: inline-block;
}

.green {
background-color: #8ce267;
}

Sie können dies überprüfen, fiddle, um zu sehen, was ich meine genau.

Vielen Dank für alle Tipps.

InformationsquelleAutor der Frage Brian Spilner | 2013-02-04

Schreibe einen Kommentar