EasyUI Forum

General Category => General Discussion => Topic started by: Pierre on January 17, 2016, 03:42:26 AM



Title: Label position2
Post by: Pierre on January 17, 2016, 03:42:26 AM
Hello all
I need to put the Label of TextArea on top instead of middle of the textarea.
You can see how it looks like (currently) here:
http://www.jeasyui.com/demo/main/index.php?plugin=Form&theme=default&dir=ltr&pitem=
and I need it on top (I'm talking about Label "Message:")
Can not post example image, folder is full.

Thank you.


Title: Re: Label position2
Post by: jarry on January 17, 2016, 04:07:21 AM
Just set the 'vertical-align' style for the <td> element.
Code:
<td style="vertical-align: top;">Message:</td>


Title: Re: Label position2
Post by: Pierre on January 17, 2016, 10:46:54 AM
Thank you so much but actually I don't use table but div:
<div class="fitem"><label>Note:</label><input class="easyui-textbox" data-options="multiline:true" style="width:75%;height:36px;"></div>

and here is css
.fitem label{
  display:inline-block;
  width:85px;
  padding:10px 30px;
}

how to put "Note:" label on top of the textbox instead of middle?
I try with
<div class="fitem"><label style="vertical-align: top;">Note:</label><input class="easyui-textbox" ... ></div>
but it does not work.

Thank you.


Title: Re: Label position2
Post by: jarry on January 17, 2016, 06:39:26 PM
Please try this code instead.
Code:
<style>
.fitem label{
  display:inline-block;
  width:85px;
  padding:0;
  vertical-align: top;
}
</style>


Title: Re: Label position2
Post by: Pierre on January 17, 2016, 11:39:28 PM
Hello
it works but there is no "space" between controls and my form looks ugly.
Is there any other way - so the textbox label is placed on top and that
padding:10px 30px;
can be used?
Because all my Form controls (labels and other) using padding:10px 30px;
I can not post image because your folder is full.
Thanks.