Message Field issue if next to Conditional Logic

• MdMbunny

• April 6, 2015 at 8:28 am

Hi Elliot,

thanks for the great work, ACF became my roots in web designing.

I’ll try to explain this issue I’m getting, sorry for my staggering English.

I’m getting a strange (but harmless) bug when I add a Message field after a set of fields with conditional logic, and I can’t find anything on my end.

I have a select field that is used to hide/show some fields (attachment 0.png).

CASE 1:
When the first choice is selected, conditional logic shows FIELD A and FIELD B (in the picture: Colore, Trasparenza).

CASE: 2
When the second and last choice is selected, conditional logic shows FIELD C (in the picture: Carica un’immagine).

As you can see from attachment_1.png, in CASE 1, the Message field moves under its previous fields.

As you can see from attachment 2.png, in CASE 2, everything works fine.

So, the bug appears when FIELD C (last field showed by the last choice) is hidden.

Thanks for everything.

attachment_0....png

attachment_1....png

attachment_2....png

• MdMbunny

• April 6, 2015 at 8:37 am

At the moment I solved it with CSS:

.acf-field-message{
clear: both;
}

but it’s not a clean way, since Message fields support field width.

• MdMbunny

• April 6, 2015 at 8:52 am

I think I got the origin of the bug.
It came from CSS and the best way I found to solve is:

.hidden-by-conditional-logic + .acf-field {
  clear: both;
}

It happens when a conditional logic hide/show 2 fields + 1 field.

Example:

CONDITION 1 shows FIELD A and FIELD B
CONDITION 2 shows FIELD C

Since the original CSS says:

.acf-field[data-width] + .acf-field[data-width] {
  clear: none;
}

and

.acf-field[data-width] + .acf-field {
  clear: both;
}

in the case FIELD C is hidden, there’s no field telling to the next one to clear:both.

I sign this topic as Solved and I’ll open a ticket.