Page 1 of 1

Edit Form Styling

Posted: Mon Mar 17, 2014 3:46 pm
by csnet
Hi,
1. I have been trying to style the input Fields so that all labels be aligned left and have same size, while the input fields stays aligned with the same width(The field width is easy by using the width property of the Object).
I have attached a picture showing what I need to achieve:
FieldStyling.PNG
FieldStyling.PNG
Is there a CSS class that gives access to the input fields Labels?

Re: Edit Form Styling

Posted: Tue Mar 18, 2014 4:58 pm
by massiws
csnet, something like this:

Code: Select all

function nuLoadEdit() {
  $( "div[id|='title_']" ).css( "text-align", "left" );
}

Re: Edit Form Styling

Posted: Thu Mar 20, 2014 11:52 am
by nuGent
I also came across the problem of not being able to align controls by manually editing their position in the objects table (ie make all textboxes left align at 100px). It seems that the object's label is controlling each object's position rather than the label and the control having their own 'left' property. So if you start dragging things around on a form you can not easily reset the position values for the controls.

Re: Edit Form Styling

Posted: Fri Mar 21, 2014 4:23 am
by admin
nuGent,

I think massiws's suggestion is a good one.

Steven

Re: Edit Form Styling

Posted: Sun Mar 23, 2014 6:21 pm
by massiws
nuGent,
with few lines of jQuery nuBuilder can be customized like you want.
Insert this in Javascript tab of your form:

Code: Select all

function nuLoadEdit() {
  $( "div[id^='title_']" ).css({
    "text-align": "left",
    "width":      "100px"
  });
}
Max

Re: Edit Form Styling

Posted: Tue Mar 25, 2014 10:10 pm
by csnet
Thanks massiw, your code is working perfectly.

Re: Edit Form Styling

Posted: Wed Mar 26, 2014 12:05 am
by massiws
.