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
  • 145
  • 3
  • 11
  • 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
  • 21,581
  • 10
  • 69
  • 79
0

Try

::ng-deep .row {
   background-color: black
 }
Oleksandr Poshtaruk
  • 2,062
  • 15
  • 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,503
  • 3
  • 23
  • 50
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