CSS Reset or Normalize?

The purpose of the reset files for css is nothing more than what the name already says, reset the default style that some elements have.

For example, the buttons have a gray background, the lists have markings on the sides, titles have borders, tables have borders, etc.

All of these are native styles of the elements. These reset files will "delete" these styles OVERLAPPING with the css contained in this reset.css .

For example:

button {
    border:none;
    background:transparent;
}

This code css will make the buttons no longer have this style.

Why do this?

The reason for using reset would be to prevent default properties from interfering with the layout you are creating. If you use a button itself that has bright colors, etc. It will not look nice with a gray button, or it will not be the same size. So one of the reasons would be visual enhancement.

Another reason would be STRUCTURAL improvement. See the image below:

Thisisatablewiththedefaultstyle.Besidestheunattractivelook,notethatithasundesirableedges,whichwilldisruptitsstructure.Toremovetheseborders,weuseresetforthetable.

Whichonetouse?

Thereisnoresetbetterthantheother,northerightonetouse,northerestrictiontouseonlyone,onlyanother,oreventousemorethanoneatthesametime.Whatyoushoulddoisanalyzewhatyouneedandhowmuchyouneedto'clear'fromthedefaultcode.Manyofthemwillcreateacssforelementsyouoftenwillnotevenuse.

I,inparticular,gottothepointofnotusinganypredefinedreset.ImyselfremovethedefaultstylesfromtheelementsIuseandneed.

Tocomplementyourreading,IfoundtheselinksthatIfoundinteresting:

• link
• link
• link

Reset

A reset as its name says will reset all browser default settings, so you can set your own css, without using the features that each browser uses.

Normalize

Normalize as the name itself will normalize, that is, it will attempt to leave the standardized styles in all browsers.

So if you want to set your own css without interference from the rules defined by the browser use reset , if you want to start based on something that already has high compatibility in browsers      and adding your rules Normalize will be better.

I leave an additional literature on the subject:

CSS: reset or normalize?

Forget normalize or resets; lay your own CSS foundation