diff --git a/src/addon/mod/data/components/index/addon-mod-data-index.html b/src/addon/mod/data/components/index/addon-mod-data-index.html
index acc54a271..422a2b75f 100644
--- a/src/addon/mod/data/components/index/addon-mod-data-index.html
+++ b/src/addon/mod/data/components/index/addon-mod-data-index.html
@@ -67,9 +67,7 @@
     </ng-container>
 
     <div class="addon-data-contents addon-data-entries-{{data.id}}" *ngIf="!isEmpty">
-        <style *ngIf="cssTemplate">
-            {{ cssTemplate }}
-        </style>
+        <core-style [css]="data.csstemplate" prefix=".addon-data-entries-{{data.id}}"></core-style>
 
         <core-compile-html [text]="entriesRendered" [jsData]="jsData" [extraImports]="extraImports"></core-compile-html>
     </div>
diff --git a/src/addon/mod/data/components/index/index.ts b/src/addon/mod/data/components/index/index.ts
index 68bdccef6..ddd5975a9 100644
--- a/src/addon/mod/data/components/index/index.ts
+++ b/src/addon/mod/data/components/index/index.ts
@@ -67,7 +67,6 @@ export class AddonModDataIndexComponent extends CoreCourseModuleMainActivityComp
     offlineActions: any;
     offlineEntries: any;
     entriesRendered = '';
-    cssTemplate = '';
     extraImports = [AddonModDataComponentsModule];
     jsData;
     foundRecordsData;
@@ -298,8 +297,6 @@ export class AddonModDataIndexComponent extends CoreCourseModuleMainActivityComp
             }
 
             if (!this.isEmpty) {
-                this.cssTemplate = this.dataHelper.prefixCSS(this.data.csstemplate, '.addon-data-entries-' + this.data.id);
-
                 const siteInfo = this.sitesProvider.getCurrentSite().getInfo(),
                     promises = [];
 
diff --git a/src/addon/mod/data/pages/edit/edit.html b/src/addon/mod/data/pages/edit/edit.html
index 19ca035f7..2e7994fc3 100644
--- a/src/addon/mod/data/pages/edit/edit.html
+++ b/src/addon/mod/data/pages/edit/edit.html
@@ -18,10 +18,8 @@
             </ion-select>
         </ion-item>
 
-        <div class="addon-data-contents {{cssClass}}">
-            <style *ngIf="cssTemplate">
-                {{ cssTemplate }}
-            </style>
+        <div class="addon-data-contents addon-data-entries-{{data.id}}" *ngIf="data">
+            <core-style [css]="data.csstemplate" prefix=".addon-data-entries-{{data.id}}"></core-style>
 
             <form (ngSubmit)="save($event)" [formGroup]="editForm">
                 <core-compile-html [text]="editFormRender" [jsData]="jsData" [extraImports]="extraImports"></core-compile-html>
diff --git a/src/addon/mod/data/pages/edit/edit.ts b/src/addon/mod/data/pages/edit/edit.ts
index 5520c8e2c..4ca834934 100644
--- a/src/addon/mod/data/pages/edit/edit.ts
+++ b/src/addon/mod/data/pages/edit/edit.ts
@@ -57,7 +57,6 @@ export class AddonModDataEditPage {
     loaded = false;
     selectedGroup = 0;
     cssClass = '';
-    cssTemplate = '';
     groupInfo: any;
     editFormRender = '';
     editForm: FormGroup;
@@ -132,8 +131,6 @@ export class AddonModDataEditPage {
 
             return this.dataProvider.getDatabaseAccessInformation(data.id);
         }).then((accessData) => {
-            this.cssTemplate = this.dataHelper.prefixCSS(this.data.csstemplate, '.' + this.cssClass);
-
             if (this.entryId) {
                 return this.groupsProvider.getActivityGroupInfo(this.data.coursemodule, accessData.canmanageentries)
                         .then((groupInfo) => {
diff --git a/src/addon/mod/data/pages/entry/entry.html b/src/addon/mod/data/pages/entry/entry.html
index 3cc182e48..19dd1987c 100644
--- a/src/addon/mod/data/pages/entry/entry.html
+++ b/src/addon/mod/data/pages/entry/entry.html
@@ -22,10 +22,8 @@
             </ion-select>
         </ion-item>
 
-        <div class="addon-data-contents {{cssClass}}" *ngIf="entry">
-            <style *ngIf="cssTemplate">
-                {{ cssTemplate }}
-            </style>
+        <div class="addon-data-contents addon-data-entries-{{data.id}}" *ngIf="entry">
+            <core-style [css]="data.csstemplate" prefix=".addon-data-entries-{{data.id}}"></core-style>
 
             <core-compile-html [text]="entryRendered" [jsData]="jsData" [extraImports]="extraImports"></core-compile-html>
         </div>
diff --git a/src/addon/mod/data/pages/entry/entry.ts b/src/addon/mod/data/pages/entry/entry.ts
index d1b26a8f1..6f6cf7649 100644
--- a/src/addon/mod/data/pages/entry/entry.ts
+++ b/src/addon/mod/data/pages/entry/entry.ts
@@ -55,7 +55,6 @@ export class AddonModDataEntryPage implements OnDestroy {
     entry: any;
     offlineActions = [];
     hasOffline = false;
-    cssTemplate = '';
     previousOffset: number;
     nextOffset: number;
     access: any;
@@ -64,7 +63,6 @@ export class AddonModDataEntryPage implements OnDestroy {
     showComments: any;
     entryRendered = '';
     siteId: string;
-    cssClass = '';
     extraImports = [AddonModDataComponentsModule];
     jsData;
     ratingInfo: CoreRatingInfo;
@@ -133,7 +131,6 @@ export class AddonModDataEntryPage implements OnDestroy {
         return this.dataProvider.getDatabase(this.courseId, this.module.id).then((data) => {
             this.title = data.name || this.title;
             this.data = data;
-            this.cssClass = 'addon-data-entries-' + data.id;
 
             return this.setEntryIdFromOffset(data.id, this.offset, this.selectedGroup).then(() => {
                 return this.dataProvider.getDatabaseAccessInformation(data.id);
@@ -167,8 +164,6 @@ export class AddonModDataEntryPage implements OnDestroy {
             this.ratingInfo = entry.ratinginfo;
             entry = entry.entry;
 
-            this.cssTemplate = this.dataHelper.prefixCSS(this.data.csstemplate, '.' + this.cssClass);
-
             // Index contents by fieldid.
             entry.contents = this.utils.arrayToObject(entry.contents, 'fieldid');
 
diff --git a/src/addon/mod/data/providers/helper.ts b/src/addon/mod/data/providers/helper.ts
index 29d6435c4..0de845835 100644
--- a/src/addon/mod/data/providers/helper.ts
+++ b/src/addon/mod/data/providers/helper.ts
@@ -423,27 +423,6 @@ export class AddonModDataHelperProvider {
         });
     }
 
-    /**
-     * Add a prefix to all rules in a CSS string.
-     *
-     * @param {string} css      CSS code to be prefixed.
-     * @param {string} prefix   Prefix css selector.
-     * @return {string}         Prefixed CSS.
-     */
-    prefixCSS(css: string, prefix: string): string {
-        if (!css) {
-            return '';
-        }
-
-        // Remove comments first.
-        let regExp = /\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm;
-        css = css.replace(regExp, '');
-        // Add prefix.
-        regExp = /([^]*?)({[^]*?}|,)/g;
-
-        return css.replace(regExp, prefix + ' $1 $2');
-    }
-
     /**
      * Given a list of files (either online files or local files), store the local files in a local folder
      * to be submitted later.