css - 送信ボタンが CSS スタイルを受け入れない

Question

設定したスタイルとは異なるフォームに送信ボタンがあります。送信ボタンを「次のセクション」ボタンと同じように見せたいのですが、見た目が異なります

関連する HTML を次に示します。

<form>
    <a href="#step2" class="btn">Next Section >></a><br/>
    <input type="submit" name="submit" value="Submit Application" id="submit" />
</form>

CSS は次のとおりです。

.btn, #submit {
    margin-top: 20px;
    background-color: #ccc;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius:6px;
    display: inline-block;
    color: #fff;
    font-family: 'Oswald';
    font-size: 20px;
    padding: 12px 24px;
    text-decoration: none;
    cursor: poiner;
    float: right;
}
.btn:hover, #submit:hover {
    cursor: pointer;
    box-shadow: 0px 0px 1px #777;
}

そして、ここに出力の違いを示す JS Fiddle があります: JS Fiddle

Answer 1

送信ボタンでこの CSS を使用します。

#submit {
    border: none;
}