Entfernen des Schattens von einer Schaltfläche

Question

Die Schaltfläche, die ich möchte, ist die eine unten, aber die, die ich habe, ist die Spitze.

Das Problem entsteht aus der Tatsache, dass die Top-Button in HTML:

<form class="button_to" method="get" action="/"><input type="submit" value="Ok" /></form> 

und die untere Schaltfläche in HTML:

<button type="button">Ok</button> 

Die CSS für die obere Taste ist :

.signup-success input[type="submit"], 
.signup-success input[type="submit"]:active, 
.signup-success input[type="submit"]:focus { 
    width: 80%; 
    background: transparent; 
    color: #00AA66; 
    border-color: #00AA66; 
} 

Die CSS für die untere Taste ist:

.signup-success button, 
.signup-success button:active, 
.signup-success button:focus { 
    margin-top: 15px; 
    width: 80%; 
    background: transparent; 
    color: #00AA66; 
    border-color: #00AA66; 
} 

Wenn die obere Taste hilft aus Schienen erzeugt wird .erb Erweiterung

<%= button_to "Ok", root_path, :method => :get %> 

Hilf mir, meine Top-Taste wie unten Taste aussehen zu erhalten. Ich habe versucht, in Code zu setzen, die Schatten in CSS deaktivieren, aber es hat nicht funktioniert :(

Answer 1

Verwenden border-style:

.signup-success input[type="submit"], 
.signup-success input[type="submit"]:active, 
.signup-success input[type="submit"]:focus { 
    width: 80%; 
    background: transparent; 
    color: #00AA66; 
    border-color: #00AA66; 
    border-style: solid; 
} 

oder kombinierte Version (border-style, border-width und border-color in einem):

border: 2px solid #00AA66;