andrew3 priority asked 1 year ago

Expected behavior label on input is centered and when focus is on the text input, the animation moves the label to the upper left-hand corner

Actual behavior stays to the left

Resources (screenshots, code snippets etc.) enter image description here

code used: css .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control-plaintext ~ label, .form-floating > .form-select ~ label { opacity: 0.65; left: 50%; top: 30%; transform: scale(0.85) translate(-50%, -50%); }

Mateusz Lazaru staff commented 1 year ago

Before focusing input, you want to have label centered how? Vertically, horizontally, or both?

After focusing, it moves to the top-left corner ,so is itlike expected?

andrew3 priority commented 1 year ago

I'd like it centered both vertically and horizontally. Upon focus moving to the upper left is fine, but initial presentation I'd like it to be centered.

Mateusz Lazaru staff commented 1 year ago

like that?

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 4.4.0
  • Device: PC
  • Browser: Firefox
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No