Images in Image Picker widget are not properly aligned with long labels

Hi,

I'm using image picker with 16 images and labels respectively. My labels are long so The images are not aligned. I tried taking help from previous queries but no use. Please help me fix my image picker widget so 4 images are shown on the screen and well aligned with long labels.

Also please make it responsive so it's seen well on mobiles.

Many thanks

I've fixed the alignment by injecting the following custom CSS codes in the widget configuration:

.imageContainer {

      float: none;

}

The widget is already responsive. Do you want to adjust the image sizes to make two or three columns? If so, try adding the following custom CSS codes in the widget:

@media only screen and (max-device-width: 550px) {

.imageContainer {

    width: 50% !important;

    margin: 10px 0px !important;

}

}

Let us know if you need further assistance.

Hi, thanks for solving the issue, but there is one more glitch. Please find attached image to see what I mean. (image link incase it's not attached here: https://www.dropbox.com/s/mhh74an3ihr9otq/Capture.PNG?dl=0 )

images and labels are unequal, please help me fix them.

Thanks

Add the following custom CSS codes in the form:

.imageContainer {

    display: inline-table !important;

}

Here's our guide on how to inject: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes. 

The output should be the layout that you desired.