1

UPD: I wrote small code for example. How I can use all styles? I have errors if use that in .scss file for child component - import "~styles.scss"; It's meaning if we use bootstrap in project, then we can't use col-lg in child component, but it's work fine in parent - For example.

I have simple structere of my parent component:

Styles.scss ( in global folder )

.row {
background-color: black
}

Parent.html

<content></content>
<div class="row"></div>

Child.html

<div class="row"></div>

So in my child I have not black background, but I have it in parent, what's wrong?

msmrc
  • 123
  • 3
  • 10
  • I tried making with your explanation here https://stackblitz.com/edit/angular-scss-demo-menwrr but it is working fine.. Can you recheck it?? – Maniraj Murugan Sep 12 '19 at 11:00

5 Answers5

0

Try:

.row {
    background-color: black !important;
}
Adrita Sharma
  • 19,704
  • 10
  • 55
  • 71
0

Try

::ng-deep .row {
   background-color: black
 }
Alexander Poshtaruk
  • 1,952
  • 11
  • 18
  • sorry, I wrote small code for example. How I can use all styles? I have errors if use that in .scss file for child component - import "~styles.scss"; – msmrc Sep 12 '19 at 10:52
0

Try 

:host ::ng-deep .row {
   background-color: black
}
Sachin Shah
  • 4,190
  • 3
  • 17
  • 47
0

Try To add the in the index page in the app. this is reflex the change

Index.html

.row { background-color: black !important }

Venkatesan
  • 1
0

To define styles globally add them to angular.json file into styles property. 

...
"assets": ["src/assets", "src/favicon.ico"],
"styles": ["src/Styles.scss"]
...

Or follow this answer if don't want use them as global