We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Custom styles are seemingly not applied at random times - ???

Thread ID:





147653 Sep 18,2019 06:57 PM UTC Sep 23,2019 06:23 AM UTC Angular - EJ 2 5
Tags: Schedule
Elise Rothberg
Asked On September 18, 2019 10:20 PM UTC


Both the numeric checkbox and the calendar seem to occasionally not apply styles and default to the basic style sheet. Is there something that can be done about this? Is it the way the custom styles are applied?  Currently, the custom style for the numeric checkbox is in a global style sheet, the styles for the calendar are locally in the component.

Attached please find an example- I opened a modal and the custom styles were not applied (the top image). I closed the modal, did nothing else, opened the modal again and the styles were applied (bottom image).

What can be done to ensure the custom styles are always applied?

Also: this has only happened on PCs or systems running Linux, not Macs.


Attachment: stylesNotAppliedThenApplied_dbe854ee.zip

Vinoth Kumar Sundara Moorthy [Syncfusion]
Replied On September 19, 2019 01:35 PM UTC

Hi Elise, 
Thank you for contacting Syncfusion support. 
We were unable to reproduce the reported issue and suspect that may be local custom styles are not loaded in your application because of encapsulation property. So, we suggest you to add the “encapsulation: ViewEncapsulation.None” in the app.component.ts file as mentioned in the below code example. 
Code Example 
import { Component,ViewEncapsulation } from '@angular/core'; 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'], 
    encapsulation: ViewEncapsulation.None 
export class AppComponent {} 
Please find the sample from the below link. 
Could you please check the above sample and still issue persists, please revert us with complete code example of the component rendering and custom styles or Issue reproducing sample? 
Vinoth Kumar S 

Elise Rothberg
Replied On September 19, 2019 11:22 PM UTC

Hi Vinoth,

Thanks for getting back to me so promptly.

Already using encapsulation: ViewEncapsulation.None.

I think this may be happening when using "cssClass='' " in the component- those styles are not always being applied.

I am waiting to hear back from some PC users and will let you know if this solved the problem.


Vinoth Kumar Sundara Moorthy [Syncfusion]
Replied On September 20, 2019 09:43 AM UTC

Hi Elise, 
Thank you for the update. 
We would like to inform you that Calendar component does not have a cssClass property. So, we have prepared the sample based on Calendar with wrapper class and NumericTextbox with cssClass property and it was working properly. 
Please refer the below API link, 
Could you please check the above details and get back to us with complete code snippet or issue reproducible sample to validate further? 
Vinoth Kumar S 

Elise Rothberg
Replied On September 20, 2019 03:41 PM UTC

Sorry- completely misspoke: I am using the scheduler, which does have a cssClass property.

When I have more information, I will update here.

Karthigeyan Krishnamurthi [Syncfusion]
Replied On September 23, 2019 06:23 AM UTC

Thank you for the update. 
We will wait to hear from you and please update us with your Scheduler code example to serve you better. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon