Vertical center in label


#1

I am trying to vertically center the text within a label on Android, I have set vertical-align: middle in the CSS and verticalAlignment=middle in the markup but the text stays aligned top.

I programatically set the position of my icon label that sits next to the label.

I’m guessing it has something to do with my mark-up but any suggestions?

<GridLayout columns="*">

    <StackLayout orientation="horizontal" col="0">

        <Label class="textButton__base"
               text="Something"
               textWrap="true"
               verticalAlignment="middle"
               height="100%"
               #textLabel>
        </Label>

    </StackLayout>

</GridLayout>

<AbsoluteLayout>

    <Label class="textButton__icon icon"
           text="{{ icon }}"
           top="{{ textLabelHeight }}"
           left="{{ textLabelWidth }}">
    </Label>

</AbsoluteLayout>

#2

In order for you to set a “position” to your label you must turn this label into a block element.
try display: inline-blockand keep your verticalAlignment="middle".

If this doesn’t work you can also try to line-height: X, in which X represents a random value that would fit for you.