Topic: Dynamic label in MDB Input appears stricken through
Expected behavior The label should appear clearly.
Actual behavior The label is appearing as crossed when on focus.
Resources (screenshots, code snippets etc.)
We are using the following line:
and in typescript we are setting this label as:
const rxInputLabel = ref('Label');
When setting a label with the following:
it is shown correctly.
Hi! Could you create a snippet where we could see what is going on? Or show some code here in comments? Does it happen every time or just on some viewport sizes? I've created a snippet and cannot recreate the issue
https://mdbootstrap.com/snippets/vue/b-cylwik/5830794#html-tab-view
Are you using the 4.1.1 version of the package?
Hello,
I have the same issue. I am trying the following:
https://mdbootstrap.com/snippets/standard/ntallas-ioannisnokia-com/5834694#js-tab-view
The thing is that I see that MDB cannot detect the number of characters of each label.
Dimitris
Bartosz Cylwik staff commented 12 months ago
Hello! I cannot recreate the issue with my fresh vue app nor inside the snippets. Bellow I'm going to ask some questions that could help me figure out what may be happening.
Is the same issue visible in this snippet?
https://mdbootstrap.com/snippets/vue/b-cylwik/5835045#js-tab-view
It is the same snippet you have created but used inside the vue (script setup is not working inside the snippets app).
Did you try to create a new app and see if the same issue occurs there? If the issue in fresh app is visible, could you publish a demo for me? If you are using the mdb cli - mdb publish will publish a demo into mdbgo.
Are you using any other ui kits or packages that could cause problems? I've seen similar issue in different technology where some classes had conflicts and were overwriting css styles.
Are you using just vue or maybe it is nuxt app?
Best Regards!
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 Vue
- MDB Version: MDB5 4.1.1
- Device: PC
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: No