Hello, I’m experiencing an issue where all fields are displaying as block (vertically) even though I have widths set on them (correctly). This problem occurs in latest Chrome and Firefox.
The issue seems to be in /assets/js/acf-input.js, around line 2506, and 2525. jQuery gets the position value of the current field, but each field seems to return a slightly different position value, sometimes off by a hundredth or thousandth of a pixel. ie: Field One (width=50) reports top position as 0, and Field 2 (width=50) reports top position as 0.0040020. So now ACF thinks these should be on separate lines.
The solution I found was to ignore minor differences like that by using parseInt.
ie: this_top = parseInt($el.position().top);
Everything lines up and works correctly after applying that to the two lines mentioned above.
Hi @emrl
Could you please share the JSON or XML export of your field group and some screenshots of the issue?
Looking forward to your reply 🙂
Hi @acf-support
Here is a paste of the JSON field group: http://pastebin.com/WVBPJMGs
And I have attached a screenshot with the section of code that tries to set the column and row classes, and then one with the final result once ACF JavaScript does run (there is a flash of the form looking *almost* correct, and then it turns into the single column).
Thank you!
Hi @emrl
I’m afraid I can’t reproduce this issue on my end. It’s possible that there’s a JS/CSS conflict on your site. Could you please try to reproduce the issue on one of the WordPress’ stock themes (like Twenty Sixteen) with other plugins deactivated? If it disappears, then you can activate the theme and plugins one by one to see which one causes the issue.
I also noticed that you are using custom field types like “hours” and “sortable_relationship”. It’s possible that these custom field types has a JS/CSS code that causes the issue. Could you please remove it and see if it fixes the issue?
Thanks 🙂
before.png.png
after.png.png
