CODEWITHSUNDEEP
cssangularsassnormalize
Jdoe
Jdoe

Reputation: 21

Normalize.css not working Angular 4/5

I am new to angular and scss. I want to get rid of the built-in browser styling and so I installed normalize.css and added it on my angular-cli.json file. 

 "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "../node_modules/normalize.css/normalize.css",
    "assets/scss/main.scss"
  ],

I have a component and added a <p>TEST</p> element and when I inspect it on my browser, the <p> element has the following style.

p {
  margin: 0 0 10px;
}

It has a margin-bottom of 10px. I am expecting that this should not have any margin. I have no idea what I am doing wrong here? Do I need to import anything else?

Upvotes: 2

Views: 1247

Answers (1)

August
August

Reputation: 2113

Normalize CSS doesn't not resets the default values to 0, but:

Normalize.css makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.

You probably have those values from boostrap also.

If you want to reset all default styles you might use Reset CSS.

It is recommended to use code inspector (Chrome Developer Tools or Firebug) in browser to check the source of your styling.

Upvotes: 2

Related Questions