CODEWITHSUNDEEP
htmlcss
Rush Frisby
Rush Frisby

Reputation: 11454

Remove submit button styling

Is there a way to remove CSS styles from an submit button so that the default browser style is applied?

Upvotes: 1

Views: 15500

Answers (6)

dotty
dotty

Reputation: 41433

You can do something like this:

button {
    padding:0; 
    margin:0;
    border:0;
    background-color:transparent;
}

Hows that?

Upvotes: 2

Matthew Gent
Matthew Gent

Reputation: 1

I found that because I had:

* { border: 0; padding: 0; }

etc etc.

in my code which affects submit buttons so I put this is instead:

*:not(input) { border: 0; padding: 0; } etc etc.

This seemed to fix it.

Upvotes: 0

Andrew
Andrew

Reputation: 13853

You can set the styles to the system values,

input.overridecss {
    background-color: ButtonFace;
    color:ButtonText;
}

jsFiddle

Here is a list of values you can override, there is probably a better list but I'm lazy.

[Edit] Here is the Specification which has been deprecated lol,

so here is the correct way I guess,

input[type=button] {
  appearance:push-button; /* expected from UA defaults */
}

from Appearence

Upvotes: 4

Codecraft
Codecraft

Reputation: 8296

If you're DEVELOPING the site - just remove the rules from the CSS file.

If you so wanted to, you could use Javascript/JQuery to remove/reset them based on some sort of condition if thats what you're looking for, ie:

$("#myButton").css("background","");

And so on...

If you're USING the site, but didn't build it - then you can (depending on your browser - i'm looking at Firefox 4) disable all or partial CSS from rendering using the web developer toolbar options... but I don't know if you can apply that as the 'default' setting for every site you load.

Upvotes: -1

Codemole
Codemole

Reputation: 3189

Well, if you dont mind to use jQuery, you can use following code to remove all styles and classes from submit buttons.

$('input[type="submit"]').removeClass();
$('input[type="submit"]').removeAttr("style");

This will remove all classes as well as inline styles, thus system default button style will be applied to your all submit buttons.

Upvotes: 0

Radu
Radu

Reputation: 8699

Store styles that you're applying programatically in a CSS class. When you want to go back to default remove the class.

Upvotes: 0

Related Questions