CSS :after used to make arrow for links not working for submit button

CSS :after used to make arrow for links not working for submit button

Ive used the CSS :after selector to create an arrow for my links. This
works fine but now I want to do the same thing to form inputs.
If I use the same class on the submit button then the :after is ignored,
im assuming because the element cant contain other other elements.
If I apply the class to a div containing the submit button then it looks
fine, but the arrow and padding outside of the actual submit button isnt
clickable.
Is there a solution to this?
http://jsfiddle.net/jn7Vj/5/
.button-style {
background: -moz-linear-gradient(top, #02AD85, #019975);
background: -webkit-linear-gradient(top, #02AD85, #019975);
background: linear-gradient(top, #02AD85, #019975);
padding: 0.7em;
border-radius: 0.5em;
border-bottom: 4px solid #003E30;
box-shadow: 0 2px 0px #252D42;
font-size: 15px; //findme
margin-top: 15px;
display: inline-block;
margin-top: 10px; //findme
border-top: none;
border-right: none;
border-left: none;
color: white;
font-size: 12px;
}
.button-style:after {
content: '';
display: inline-block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0.4em 0 0.4em 0.7em;
border-color: transparent transparent transparent #FFF;
margin-left: 0.75em;
}
.button-style input {
background: none;
border: none;
color: white;
font-size: 12px;
margin: 0;
padding: 0;
}
<a href="#" class="button-style">Here is a link</a>
<form class="webform-client-form" enctype="multipart/form-data"
action="/cchetwood/4/contact" method="post" id="webform-client-form-4"
accept-charset="UTF-8"><div><div class="form-item webform-component
webform-component-textfield" id="webform-component-full-name">
<input type="text" id="edit-submitted-preferred-times-to-contact-optional"
name="submitted[preferred_times_to_contact_optional]" value="" size="60"
maxlength="128" class="form-text">
<input type="submit" class="button-style" value="Submit">
<div class="button-style">
<input type="submit" value="Submit">
</div>
</form>