Rendering issue

[Massimiliano]

Hello

I tried in many ways, but it never renders correctly.

I tried your code at https://stackblitz.com/edit/react-ghzkbv but running it locally (npm run start) I have my same behaviour.

Attached a screenshot of what I have.

Can you please help me?

Attachment: Screenshot_20190617_at_12.22.21_690671fd.zip

[Prince Oliver]

Hi Massimiliano, 

Greetings from Syncfusion support. 

Based on the shared information, we suspect that you might have missed to include the Material.css theme file in you end, which is required for rendering the control UI properly. Kindly include the following CSS file in your application. 

<link rel='nofollow' href="https://cdn.syncfusion.com/ej2/material.css" rel="stylesheet" /> 

Let us know if you need any further assistance on this. 

Regards, 

Prince 

[Marco Giorgi]

Hi, I have this in my App.scss file:

@import "~@syncfusion/ej2-base/styles/material.css";

@import "~@syncfusion/ej2-react-navigations/styles/material.css";

@import "~@syncfusion/ej2-inputs/styles/material.css";

@import "~@syncfusion/ej2-buttons/styles/material.css";

@import "~@patternfly/react-core/dist/styles/base.css";

and, however, I downloaded your sample from https://stackblitz.com/edit/react-ghzkbv and running it with `npm run start` led to the same result.

[Christopher Issac Sunder K]

Hello Marco, 

Good day to you. 

We have downloaded and checked with the stackblitz sample. In the sample, we have imported the mentioned css styles in style.css file and found that the ej2-react-dropdowns style is not referenced. Thus, the material theme style is not applied to the component. You need to import the below CSS for styling the DropDownList along with your other style files, 

/* import the DropDownList dependency styles */ 

 

@import "../node_modules/@syncfusion/ej2-base/styles/material.css"; 

@import "../node_modules/@syncfusion/ej2-inputs/styles/material.css"; 

@import "../node_modules/@syncfusion/ej2-react-dropdowns/styles/material.css"; 

Please refer to the below documentation for the required CSS references for DropDownList component, 

https://ej2.syncfusion.com/react/documentation/drop-down-list/getting-started/#adding-css-reference 

The downloaded sample has been modified with the mentioned CSS and you can find it from the below link, 

http://www.syncfusion.com/downloads/support/forum/145309/ze/react-ghzkbv_2-1579566209.zip 

Please check the sample and get back to us if you require any further assistance. 

Thanks,
Christo