Ich muss ein Eingabefeld mit dem folgenden Hintergrund erstellen

Bisher habe ich in meinem Code den folgenden Code und der wird nicht angezeigt -> Wie ist die richtige Vorgehensweise, um dies zu tun?

Ich habe auch ein paar Variationen dieses Buttons, die ich produzieren muss und die folgenden sind:

Ein Kreuz auf dem dunklen Bereich des Knopfes - ich wollte gerade a verwenden<span> tagge mit einer Klasse und setze die Grafik darauf -> Wäre das ein guter Weg?

Ein Büroklammersymbol gleich nach der Kurve links -> Ich wollte das Gleiche tun wie oben -> Wäre das ein guter Weg?

HTML:

<div class="innerTo">
        <form action="#" method="get">
           <label for="recipients">TO: </label>
              <input type="search" name="recipients" id="recipients" placeholder="Recipients Names">
    </form>
    </div>

CSS:

.innerBar .innerTo{
    width:200px;
    padding:5px 0 0 15px;
    display:block;
    float:left;
}
.innerBar .innerTo label{
    margin:0 15px 0 0;
    font-size:14px;
    font-weight:bold;
    color:#666666;
}
.innerBar .innerTo input[type=search] {
    color: red;
}
.innerBar .recipients{
    background-image:url('../images/searchBGpng.png') no-repeat;
    width:192px;
    height:27px;
}