how to disable width: 100%; and box-sizing: border-box;

Question

I have submit button in wrapper div. I have global settings for all this situations where input is in wrapper like that.

I want just for one to be in center of wrapper, but property width:100%; and box-sizing: border-box; is on full width so my text-align: center; property will not work. I want to disable full width to margin button to center of wrapper.

Question:

How to disable width: 100%; and box-sizing: border-box; with CSS?

Therefore I can center input to center.

HTML:

<div class="wrapperInput">
    <input type="submit" class="submit" value="Submit">
</div>  

CSS:

#wrapper .wrapperInput input {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
     box-sizing: border-box;
}

Answer 1

Try with:

#wrapper .wrapperInput input {
    width: auto;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
     box-sizing: content-box;
}