mog5808 pro asked 5 years ago

I want to disable the label floating. I am using pug
                    label(for='form52') Your email
The code above works well for the floating labels when i remove the md-form there is too much padding and i tried the following and it does not work either

        'userFirstName') First Name *
Any ideas? Thanks

Magdalena Obalska free answered 5 years ago

Ok, now it's clear.
<div class="md-form">
    <input placeholder="example input" type="text" id="form1" class="form-control">
    <label for="form1">Example label</label>

nickgardnermedia pro commented 5 years ago

For anyone else looking to solve this, just modify the following line in SCSS for pro: _variables.scss -> line 195 -> translateY( ) This is a negative number and moves the label up when the input is selected. I changed from -140 to something more subtle like -10 but you could put 0 or remove the line to keep it static. Also, for non scss just add the following to custom styles.scss: .md-form{-webkit-transform:translateY(-10%);-ms-transform:translateY(-10%);transform:translateY(-10%)} Replace -10% with your value as necessary.

mog5808 pro answered 5 years ago

Sure thing,

<div class="md-form">
    <input type="text" id="form1" class="form-control">
    <label for="form1" class="">Example label</label>
The code above will create an input with type=text then when clicked the label Example label will move up. How can i stop the label from moving up. Basically i want the label to always stay on top. Cheers,

Magdalena Obalska free answered 5 years ago

Paste here all the exact code and explain in details what's wrong and what's your aim.

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

  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: Yes
  • Provided link: No