When I am developing a website with Angular, my code typically looks like this:
<div class="main">
<div class="container">
<app-name>
<div class="app-child-div"></div>
</app-name>
</div>
</div>
However, the app-name tag may change once deployed. In such cases, how can I use SCSS to target the app-child-div with CSS?
Currently, I have attempted the following approach:
.main {
.container {
app-step-0 {
.app-child-div {
background: green;
}
}
}
}
Unfortunately, this method doesn't seem to work effectively. Are there any other solutions available?