Hi, I want to vertically align text in Textarea. I have tried this so far:
In styles: vertical-align: middle;
and I’ve tried these from bootstrap: (Class) Vertical alignment · Bootstrap
Can’t get any of the above to work.
Does anone know an easy way to do this
Thanks
Will.
With Bootstrap 4 textarea this would work at property style: text-align: center
The header can be centered too by setting class property to text-center
Thanks for getting to me, yes that aligns text centre (horizontally). What I want to do is to place text in the middle of the Textarea (vertically) as well as horizontally.
Sorry. Some people say that textarea does not recognize vertical-align: middle. Workaround should be with calculating top, bottom, margin in percent and auto.
No I couldn’t get it to work. There are margins in the properties window in design but when I try to set left and top margins in % it just moves the whole Text area. I’ll just play around with the style and class properties with the margins to see if I can figure it out.
Thanks
Will.
I stopped working with textarea some time ago because I could not solve certain tasks with textareas. Nowadays I do use BS4 cards instead. Cards are fine to fit my purposes. Perhaps I never felt the necessity to vertically align text, because I built the text container just the size it needed to contain the text and adjusted only the vertical position of the container.
At least with Card I seem to have got it working after having found a solution by internet research. I added a style named block at ProjectCSS:
.block {
border: 1px solid blueviolet;
height: 150px;
display: table-cell;
align-items: center;
justify-content: center;
vertical-align: middle;
}
This presumably can be improved.
At card class property I set class as well as textClass to “block”. This is the visible result:
.blockin {
border: 1px solid green;
display: table-cell;
height: 270px;
align-items: center;
justify-content: center;
vertical-align: middle;
}
