CODEWITHSUNDEEP
htmlcssionic-framework
user944513
user944513

Reputation: 12729

how to center label with placeholder?

I make a simple app of form .I am able to make almost 90% .But I have one issue .In my app I have label and in front of that i have text field .I need the label text should be centre or in same base as placeholder ,enter image description here

.I try to give top:5px margin-top:5px but nothing work .In other words Requirement label should be in same level as placeholder of textfield .

here is my code http://codepen.io/anon/pen/NGPvge

.wrapper{
    padding-top:3em;
}
.label_title div {
    text-align: center;

    margin-top: 1em;
    position: relative;

}

Upvotes: 0

Views: 346

Answers (2)

Luis
Luis

Reputation: 787

Add line-height: 50px; to the DIV

.label_title div {
    line-height:50px; // <- Pull the text down 50px
    text-align: center;
    margin-top: 1em;
    position: relative;
}

Upvotes: 0

Shehary
Shehary

Reputation: 9992

Make these changes in 

.label_title div {
    text-align: center;
    margin-top: 1em; <<<---Remove this
    line-height: 50px; <<<---Add this
    position: relative;
}

Label will be align with place holder.

Fiddle

Upvotes: 1

Related Questions