Image Picker Widget: Centering the images

  • Profile Image
    Asked on March 16, 2015 at 07:04 AM
    2. How do i centralise the text & images when viewed on various screens?
  • Profile Image
    Answered on March 16, 2015 at 10:37 AM


    Unfortunately, this widget is placed inside the iFrame container which is why you can't apply custom css just by injecting it.

    In order to make the image to appear in the center, you can reduce the width of the form using the Form Designer tool. Under the Form Layout, put 550 on the form width. You also need to enable the "Make this form responsive" option.

    You also need to apply this custom CSS code for the text above the widget to appear at the center of the form. In the form designer, go to the CSS tab then paste this code.

    #label_1 {

        text-align: center !important;

        width: 100% !important;


    Another way of injecting custom CSS:

    Here is a demo form. You can clone it if you like.

    Hope this helps. Let us know if you need any help.

    Thank you.