Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Reset/remove all styles for input, select and button across all browsers including mobile

I've searched all over for this but I can only find how to change/modify styles for input, select and button elements.

What I want to do is remove all shadows, borders, background, icons etc everything except the value itself, across all browsers and mobile.

like image 417
MrJamesBond Avatar asked Nov 02 '15 11:11

MrJamesBond


People also ask

What are reset styles?

A reset stylesheet (or CSS reset) is a collection of CSS rules used to clear the browser's default formatting of HTML elements, removing potential inconsistencies between different browsers.

How do I remove a style from a specific element?

Use the style. removeProperty() method to remove CSS style properties from an element, e.g. box. style. removeProperty('background-color') .

What is HTML reset?

Definition and Usage The <input type="reset"> defines a reset button which resets all form values to its initial values. Tip: Avoid reset buttons in your forms! It is frustrating for users if they click them by mistake.


1 Answers

You can use normalize.css for improve the cross-browser rendering. You can update the following class in the normalize.css.

button,
input,
optgroup,
select,
textarea,html input[type="button"],
input[type="reset"],
input[type="submit"],button[disabled],
html input[disabled],button::-moz-focus-inner,
input::-moz-focus-inner, input[type="checkbox"],
input[type="radio"], input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button, input[type="search"], input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration

Please add the following style to the above elements.

element {
    border:none;
    background-image:none;
    background-color:transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
like image 148
Fazil Abdulkhadar Avatar answered Sep 20 '22 19:09

Fazil Abdulkhadar