Field Editor and Template fields are being cut-off in a pop-up

edited February 2, 2017 in Questions
I'm trying to figure out why my field editor values (both model fields and templates) are being cut off in a pop-up window (see first image)

image

There is no CSS assigned to the popup, the panel set or the field editor fields/templates.  This is happening on all components within the popup.

This is what the Skuid editor looks like for this component.

image

Comments

  • edited November 15, 2016
    Debbie,

    Do you mean to say that the template field you have there is rendering halfway on the page, so that School of Business is cut in half?
  • edited January 9, 2017
    Hi Karl, yes.  You can only see the top portion of "School of Business", the bottom portion of this text is being cut off.

    The same is happening with check box fields.  The lower half of the check box is being cut off.
  • edited November 15, 2016
    Could you paste what you have going on inside the template? When you resize the browser window, does it fix for the rendering issue? If you allow HTML, does that solve the glitch?
  • edited January 9, 2017
    Resizing the window does not help.

    Here is the template:

    {{job_title__c}} at <b>{{employer__c}}</b>     
    HTML is enabled for the template.

    It's not just templates, though.  Model fields are also getting cut off.  Here is a screenshot of  what some checkbox fields look like.  Note that the bottom of the boxes are being cut off.

    image


  • edited February 2, 2017
    Debbie,

    Are all other fields that are not in the popup ok? Or are they messed up as well?

    Do you, by any chance, have global field CSS styling or anything in other CSS resources (could also be in the theme)? The selector to look for would be .nx-field or .nx-fieldtext.

    Cheers
  • edited January 9, 2017
    Brilliant!  I'm not very strong with CSS, but I did find the offending statement.  I ended up creating a new CSS resource with a unique identifier and tagged this pop-up with the new CSS.  So it is working better now.  I still have one field in the popup (a template field displaying a Text Area field) that is not obeying the "overflow: visible" characteristic.  This is my new CSS:

    #connections .nx-fieldtext{height:50px; overflow: visible;}

    Do I need a different statement to apply to a Text Area field?
  • edited February 2, 2017
    You could add a style attribute to the text area field containing the appropriate values ;)
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!