WebHolism

@greventscalendar thank you for the speedy reply, much appreciated!

Hi @soberpaddy,

I have been dong some additional investigation on some local simple form designs, and I wonder if you could try the following on your end, and provide feedback on the outcome?

@media screen and (max-width: 1024px) {
  .post-11160 .gfmc-container {
    align-items: stretch !important;
    flex-direction: column !important;
    justify-content: space-around !important;
  }
}
@media screen and (min-width: 1025px) { 
  .post-11160 .gfield.gfmc-column.gfmc-field:nth-child(2) {
  max-width: 23%;
  padding: 0px 10px;
  }
}

This would replace the previous code that was inserted.

Thank you for your time and hope to receive a response at your earliest convenience.

Kind regards.

• This reply was modified 1 year, 5 months ago by WebHolism.

Hi @soberpaddy,

Thanks for the response. I realise that the CSS provided previously was incorrect, but on investigation of the adoption row that you highlight, that some additional alteration may be necessary.

Would it be possible for you to provide a JSON export of the form (https://docs.gravityforms.com/exporting-a-form-from-gravity-forms/) to [email protected]?

Thank you for your time and assistance in this matter.

Hi @soberpaddy,

Thank you for the prompt response, and for confirmation that the CSS is working for desktop.

Would you be able to place the CSS that has been created in alignment with what was shown above, into an @media media query? Perhaps something like:

@media screen and (min-width: 600px) and (max-width: 900px) {
  .gfield.gfmc-column.gfmc-field:nth-child(1) {
    max-width: 25%;
  }
}

The values of min and max width will need to be specified according to your requirements.

Please advise if this is of any use, or if there are problems with this approach. Thank you.

Also, I looked at the link that you provided, but was not certain where Needed to look on the page, and which elements were to be modified. If you are able to provide additional clarification if you need to contact us again? Thank you.

Hi there @soberpaddy,

Thank you for using the plugin.

Depending on the complexity of the form that you’ve created, for example if it is a single row that has been defined using the plugin, you could go with something similar to:

.gfield.gfmc-column.gfmc-field:nth-child(1) {
  max-width: 25%;
}

This would allow the first column to have a width set to 25%.

You could also specify a Custom CSS Class in Gravity Forms on the particular Row Start element, such as short-row and then add the CSS (similar to that seen above):

.gfield.gfmc-column.gfmc-field.short-row {
  max-width: 25%;
}

Which would limit it to the specific row.

The above can be manipulated to flex to your requirements. More complex forms will require further alteration of the above CSS.

If you are still encountering issues, and are able to provide your form (link to existing form, or export of .json file), with supporting information regarding your specifications, then it may be possible to generate a more tailored response.

Hope that helps. ??

Kind regards.

Hi @rseitzberg,

Thank you for the link.

Could you try adding the following CSS to the form page and seeing if it resolves the issue?

.gfield.gfmc-column.gfmc-field {
  flex-basis: unset;
}

Thank you for your time.

Hi @rseitzberg,

Thank you for reaching out and asking about this issue.

Would you be able to send a link to the URL of the form that you are working on to [email protected], or just add it as a new message?

Thank you for your cooperation.

Kind regards.

Hi @blackstar1991,

It would appear that the issue that you have raised is unrelated to this plugin, at least as far as is visible from the screenshot. If this is related to Gravity Forms core plugin, you will need to contact them directly, which can be achieved from the page https://www.gravityforms.com/help/

Please let us know if there is anything else that we can assist with.

Hi @mindyeveraftervisualscom,

Having had a look at the form, the second column appears to have a restricted width, which expands to accommodate the full text when the checkbox is checked, at least that is the behaviour that we are witnessing. To resolve this, would you be able to add the following CSS to the form page:

.gform_wrapper.gravity-theme .gform_fields {
  grid-template-columns: unset;
}

Can you please examine that the form displays as expected after inserting this code and advise if it resolves the issue?

Thank you for your time and please advise if the approach above does not address the issue that you are highlighting, or has other knock-on effects.

Thank you.

Hi @dozza,

Thank you so much for sending the Loom videos, it made understanding much easier.

Glad that the CSS appears to have helped with the issue. ?? If you have any other problems, please don’t hesitate to ask.

Kind regards.

Hi @dozza,

Your video was really useful in explaining the issue.

We had a poke around your form, having copied the URL from the video (for the /mini-kardes-admission-form/ page currently displayed), and examined the code output using the inspector.

Would it be possible to try adding the following to your custom CSS for this page:

.spacer.gfield {
  display: none;
}

If this does not resolve the issue, would it be possible to provide an export of your form (https://docs.gravityforms.com/exporting-a-form-from-gravity-forms/) to [email protected]?

Thank you for your time, and we look forward to receiving an update at your earliest convenience.

Kind regards.

hi @effecticore,

Thank you for your email and the attached export of your form. This is being looked into and we will update this ticket soon.

Thank you for your patience and apologies for the inconvenience.

Kind regards.

Hi @effecticore,

When creating forms with both default Gravity Forms column creation as well as the Multiple Columns plugin, we are not experiencing any issues. Please can you send an export of your form (https://docs.gravityforms.com/exporting-a-form-from-gravity-forms/) to [email protected]?

Thank you for your time and sorry for the inconvenience.

Hi @effecticore,

Please can you tell me if when you are looking at the form entries, do you have the ‘show empty fields’ checkbox checked?

Thank you.

Hi @marcizus,

Thank you for the notification of this. Are you experiencing any issues with the plugin behaviour at all?

The point you have highlighted will be investigated.

Wishing you a wonderful day.

Kind regards.