Topic: My select component isn't displaying properly
steadystateadmin asked 3 years ago
*_Expected behavior_* Input select component code and display component as shown in example
Code: https://prnt.sc/1vqa6yo, https://prnt.sc/1vqak6e
Example: https://prnt.sc/1vqadb0
*_Actual behavior_* What is comes out like in my application
Resources (screenshots, code snippets etc.)
Michał Duszak staff answered 3 years ago
Are you sure those styles are applied? Is your webpack configuration serving them properly? You can check it in your Resources tab in Dev Tools. Also you can try linking css file with link
element. Also make sure you imported styles properly. For further information, please check this page: https://mdbootstrap.com/docs/standard/getting-started/installation/
steadystateadmin commented 3 years ago
The standard components are styled properly using that css import. But the PRO components are not styling even after I import them. The select component im tryin to use is a PRO component
HTML: https://prnt.sc/1vtrlzb
Index.html https://prnt.sc/1vtra1m
angular.json https://prnt.sc/1vtrgvj
Preview https://prnt.sc/1vtruse
Michał Duszak staff commented 3 years ago
Are you using angular in this project? If so, try using this documentation: https://mdbootstrap.com/docs/b5/angular/forms/select/
Stig Kølbæk pro premium priority commented 3 years ago
I too have this issue, the class="select" does not display as expected, it is looking lige very plain HTML selects! .. using 3.9.0 Standard MDB
Michał Duszak staff answered 3 years ago
@Stig Kølbæk Could you please provide your js and css files imports? Are you sure they are properly done? Are you importing UI KIT via npm, or are you attaching files manually? Do you receive any error messages in your console?
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 3.9.0
- Device: Laptop
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: Yes