Can you style html form buttons with css?

Question

I don't like the default button style. It's really boring. I am using

<input type="submit">

type buttons. Can I style these somehow in css? If not, the other way of doing it i guess would be to use a div instead, and make it a link. How do you make those work with forms?

Answer 1

You can achieve your desired through easily by CSS :-

HTML

<input type="submit" name="submit" value="Submit Application" id="submit" />

CSS

#submit {
    background-color: #ccc;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius:6px;
    color: #fff;
    font-family: 'Oswald';
    font-size: 20px;
    text-decoration: none;
    cursor: pointer;
    border:none;
}



#submit:hover {
    border: none;
    background:red;
    box-shadow: 0px 0px 1px #777;
}

DEMO