2013-09-11 2 views
0

У меня есть форма html5 с jquerymobile. В некоторых текстовых вводах я хочу добавить кнопку справки. Поэтому я включил -элемент с кнопкой данных-роли в -tag. Это почти то, что я хочу, но положение кнопки и текста не так приятно. Вот мой код:Textorientation jquerymobile button textinput

<div data-role="fieldcontain"> 
    <label for="t0098">Others <a href="#info_split" data-role="button" data-rel="popup" data-inline="true" data-icon="info" data-iconpos="notext">i</a></label> 
    <input type="text" name="t0098" id="t0098" data-clear-btn="true" /> 
</div> 

Результат выглядит следующим образом: Screenshot

Я предположил, чтобы добавить некоторые CSS-правила, как vertical-align: middle !IMPORTANT к ней этикетки, но она не казалась tochange ней.

+1

Я не совсем уверен, но я думаю, что проблема заключается не в ярлыке, а в изображении внутри. Попробуйте применить 'vertical-align: bottom;' к 'a' внутри метки. – Jan

+0

Устанавливая как 'label', так и' a' '' vertical-align: middle; 'работал! Большое спасибо! –

+0

@Jan вы должны оставить свой комментарий в качестве ответа, так как вы пригвоздили проблему. Даже если это началось как комментарий, так Кай может это принять. – alkis

ответ

0

(В соответствии с рекомендациями АЛКИС, я отправляю это как ответ.)

Чтобы правильно выровнять текст и изображения, вы должны применить vertical-align: middle; к a внутри label.

И, как упоминал Кай, применяя vertical-align: middle; к label, а также дает окончательный штрих.

Смежные вопросы