Suchfeld korrekt formatieren in Firefox/IE

Question

Ich habe ein Suchfeld, das mit CSS gestylt ist. In Chrome und Safari sieht alles gut aus. In meinen Bildern unten sehen Sie jedoch, dass es in der Mitte des Suchfelds in Firefox eine zufällige Box gibt und dieselbe zufällige Box, zusammen mit dem Pfeil, der im IE fehl am Platz ist.

Wie kann ich das in meinem CSS beheben, so dass sie korrekt mit dem Pfeil in der Mitte formatiert sind, wie es in Firefox ist und dass die grüne Box in der Mitte komplett verschwunden ist?

Firefox Beispiel:

IE Beispiel:

Suchfeld HTML:

<input name="ValueToSearch" class="search" type="text" placeholder="Value to Search"> 
<span class="arrow">    
    <button type="submit" class="button" name="search" value="Search">Search</button><br> 

CSS für Suchfeld:

.search { 
    padding:8px 15px; 
    background:rgba(50, 50, 50, 0.2); 
    border:0px solid #dbdbdb; 
} 
.button { 
    position:relative; 
    padding:6px 15px; 
    left:-8px; 
    border:2px solid #007b54; 
    background-color:#007b54; 
    color:#fafafa; 
} 
.button:hover { 
    background-color:#fafafa; 
    color:#207cca; 
    cursor: pointer; 
} 


::-webkit-input-placeholder { /* For WebKit browsers */ 
    color: black; 
    font-weight: bold; 
} 

:-moz-placeholder { /* For Mozilla Firefox 4 to 18 */ 
    color: black; 
    font-weight: bold; 
} 

::-moz-placeholder { /* For Mozilla Firefox 19+ */ 
    color: black; 
    font-weight: bold; 
} 

:-ms-input-placeholder { /* For Internet Explorer 10+ */ 
    color: black; 
    font-weight: bold; 
} 


.arrow { 
    position: relative; 
    left: -8px; 
    background: #007b54; 
    padding: 8px 15px; 
} 

.arrow:after { 
    right: 100%; 
    top: 50%; 
    border: solid transparent; 
    content: " "; 
    height: 0; 
    width: 0; 
    position: absolute; 
    border-color: rgba(32, 124, 202, 0); 
    border-right-color: #007b54; 
    border-width: 10px; 
    margin-top: -10px; 
} 

Answer 1

Sie zu clos vergessen e Ihr <span class="arrow"> Tag. Macht es ein bisschen besser!