control spacing

Follow
Avatar
Sylvia Able

Does anyone know how to change the row spacing in a subform?

I've seen the RowScale button in the eForms builder, but that pertains only to the form and still leaves a lot of space between rows on the form.

I really want the capability of the subform, but the look of a grid where the rows aren't so far apart and there are borders at least around the whole subform, if not between each row as well...

I'm sure this all takes CSS.

Has anyone already solved this?  Here's an example of what my subform looks like:

thanks for any help you can provide!

0

Comments

9 comments

Sort by Date Votes
  • Avatar
    Alexey Shmelkin (sysberry-absc.com)

    Hi Sylvia,

    you can increase each control width, will it help?

    Regards

    Alexey

    0
    Comment actions Permalink
  • Avatar
    Sylvia Able

    Sorry, Alexey, I wasn't clear...

    I want to reduce the spacing between row 1 and row 2...  Not the spacing between controls in a single row...

    In the screenshot I included, the amount of vertical space taken up is enough for 3 rows of data.

    Thanks!

    0
    Comment actions Permalink
  • Avatar
    Alexey Shmelkin (sysberry-absc.com)

    Hi Sylvia,
    On the ribbon there is a button to change the spacing between rows. There you can change that. If you need even smaller spacing you will definetely need to write css.
    Regards
    Alexey

    0
    Comment actions Permalink
  • Avatar
    Sylvia Able

    Yeah, I assumed it would take CSS.  Just wondering if anyone else has written some to do this that they are willing to share.  I'm not that strong in CSS.  :)

    0
    Comment actions Permalink
  • Avatar
    Gwen Wilson

    Hi Sylvia, were you able to figure this out? I also know only a little css. I know how to do the styling, but can't get the name of the controls correct to call the code.

    0
    Comment actions Permalink
  • Avatar
    Jean-Sébastien Renaud

    I'm really interested too if someone has a hint of the CSS code that could help us do this.

    Thanks! 

    0
    Comment actions Permalink
  • Avatar
    Sampat Patil

    Hello,

    Please make use of below style. 

    #ControlID .subFormContentRow { 
        height: 35px; 
    }

    Note: ControlID is your subform ID

    0
    Comment actions Permalink
  • Avatar
    Sylvia Able

    I have an app that will adjust the spacing.  It is very application specific, though, so not sure it will help you.  Since I can't attach it here, I'll have to give you the js and a screenshot...

    /*
    * JQuery WYSIWYG Web Form Designer
    * Copyright 2015 AgilePoint Inc
    */
    function ApplyCSS2RemoveSpaces() {
    //this will apply the CSS to remove the spaces between the previewRows.
    //debugger;
    var oMargin = getFieldNameObjectValue('MarginNumber')+"px";
    $('#previewRow6').css("margin-top", oMargin);
    }

    function getFieldNameObjectValue(fieldName) {
    var value;
    eFormHelper.getFieldValue({ fieldId: fieldName }, function (result) { value = result.data; });
    return value;
    }

     

     

    0
    Comment actions Permalink
  • Avatar
    Gwen Wilson

    I did get something to work last night (not sure if it's the best way, but it worked)... 

    .subCtrlPreviewCtrlHolder.occupiedControl {
    padding:2px !important;
    }

    This sets the padding for all controls on the subform (which may or may not be ok based on your set up). I found that the padding is set to 10px by default. I reduced it to 2.

    0
    Comment actions Permalink

Please sign in to leave a comment.

Didn't find what you were looking for?

New post