question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Placeholder not showing correctly when inside a modal

See original GitHub issue

Version

3.3.4, BS4

Steps to reproduce

Create a Typeahead with multiple and placeholder inside a modal

Expected Behavior

The placeholder should fully show once the modal is open, without having to focus on the field

Actual Behavior

selection_004

The placeholder text is initially cut off, you have to focus on the field in order for the placeholder text to appear. This happens due to the fact that the width of the input element is initially set to 3px, which doesn’t expand until after focus.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:9 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
YassienWcommented, Feb 22, 2019

Switching to reactstrap sorted this out. Thanks for the help Eric.

0reactions
YassienWcommented, Feb 22, 2019

Yeah, i am using JQuery for the modals. I will be switching to reactstrap ASAP and letting you know if it fixes it. Thanks!

Read more comments on GitHub >

github_iconTop Results From Across the Web

PlaceHolder is not displaying in Select2 drop down on Modal
I can see the placeholder , there must be some versioning issue. $(document).ready(function() { $('.dropdown').select2({ placeholder: ...
Read more >
Input label does not move up when value or placeholder is sp
I am trying to use mdbootstrap in my meteor app but am running into issues with forms: the label does not move above...
Read more >
:placeholder-shown - CSS: Cascading Style Sheets | MDN
The :placeholder-shown CSS pseudo-class represents any or element that is currently displaying placeholder text.
Read more >
change mm/dd/yyyy in placeholder input type date - You.com
The placeholder attribute does not work with the input type Date, so place any value as a placeholder in the input type Date....
Read more >
lightning-input - documentation - Salesforce Developers
The following HTML input types are not supported. ... The placeholder text is displayed on the field before a user enters an input,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found