Question: We have used angular custom directive to generate a custom html tag called .The corresponding style sheet file for this tag is student.scss and its content is 

```
student-result {/* Sonarqube is reporting critical issue at this line saying 
              "Remove the usage of the unknown "student-result" type selector" */

   .student-result-top {
      position :absolute;
      height :300px;
   }
}

```

Can anybody suggest any way to resolve the issue or any plugin which will make sonarqube to recognize these custom HTML tags?

Answer: 
Geo j's approach of using a class selector instead of an element selector is good. Instead of editing every html source file to add the class, you can use `@HostBinding` to give every instance of the component the same class by default:

```
@HostBinding('class.student-result') hasStudentResultClass = true;

```
Instead of using the angular selector directly inside your scss file give an id or class to it and apply required style.

```
<student-result class="student-result"></student-result>

```

Now in your scss access the same selector as **.student-result** instead of student-result. This might help I believe.