CODEWITHSUNDEEP
htmlcssbootstrap-4
Ahmed Ali
Ahmed Ali

Reputation: 21

How can I create an input with text at top instead of centered

How Do I make the text start from the top instead starting right in middle?

<input class="card card-experience">
.card-experience{
    width: 600px;
    height: 100px;
    position: absolute;
    padding-bottom: 22px;
    top: 400px;
    border-color: black;
    box-sizing: border-box;
}

Upvotes: 0

Views: 364

Answers (2)

Nisuga Jayawardana
Nisuga Jayawardana

Reputation: 432

Following may satisfy your requirement. Remove padding-bottom and change input tag to textarea

    .card-experience {
        width: 600px;
        height: 100px;
        position: absolute;
        top: 400px;
        border-color: black;
        box-sizing: border-box;
    }

    <textarea class="card card-experience"></textarea>

note: when you want to input data in multiple lines, input tag should be changed as textarea tag.

Upvotes: 0

vS12
vS12

Reputation: 310

  1. input type="text" is used for single lines of text.

  2. You can instead use "textarea", going by the size of your input element it seems that you want to take a large input or allow lot of lines of input. "textarea" will allow you to do that, and at the same time the text starts from the left top.

Refer: https://www.w3schools.com/tags/tag_textarea.asp

In case you use "textarea" and do not want the scroll bar then refer this :

Remove scrollbars from textarea

Upvotes: 1

Related Questions