White-space where instructions would be

I can’t reproduce this behavior. Could you please reply a JSON export of your field group.

Here’s a basic example. There are three fields in each row, one of the fields has a long set of instructions. On page load that causes a large whitespace under the fields taking up the space of the instructions. Toggle the switch on and off and the fields will shrink to a normal size without the whitespace.

Hope that helps.

[
    {
        "key": "group_5b59ef0bca2dd",
        "title": "Test Group",
        "fields": [
            {
                "key": "field_5b59ef4b44946",
                "label": "Radio Button",
                "name": "radio_field",
                "type": "radio",
                "instructions": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
                "required": 0,
                "conditional_logic": 0,
                "wrapper": {
                    "width": "33",
                    "class": "",
                    "id": ""
                },
                "choices": {
                    "Option A": "Option A",
                    "Option B": "Option B"
                },
                "allow_null": 0,
                "other_choice": 0,
                "save_other_choice": 0,
                "default_value": "",
                "layout": "vertical",
                "return_format": "value"
            },
            {
                "key": "field_5b59f02a44947",
                "label": "Checkbox Field",
                "name": "checkbox_field",
                "type": "checkbox",
                "instructions": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse porttitor condimentum nulla id molestie. Mauris faucibus felis id magna lobortis egestas. Donec lacinia mi est, nec gravida urna aliquam at. Etiam sagittis imperdiet accumsan.",
                "required": 0,
                "conditional_logic": 0,
                "wrapper": {
                    "width": "33",
                    "class": "",
                    "id": ""
                },
                "choices": {
                    "Option A": "Option A",
                    "Option B": "Option B",
                    "Option C": "Option C"
                },
                "allow_custom": 0,
                "save_custom": 0,
                "default_value": [],
                "layout": "vertical",
                "toggle": 0,
                "return_format": "value"
            },
            {
                "key": "field_5b59f08744948",
                "label": "Select Field",
                "name": "select_field",
                "type": "select",
                "instructions": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
                "required": 0,
                "conditional_logic": 0,
                "wrapper": {
                    "width": "33",
                    "class": "",
                    "id": ""
                },
                "choices": {
                    "Option A": "Option A",
                    "Option B": "Option B",
                    "Option C": "Option C"
                },
                "default_value": [],
                "allow_null": 0,
                "multiple": 0,
                "ui": 0,
                "ajax": 0,
                "return_format": "value",
                "placeholder": ""
            },
            {
                "key": "field_5b59f588f2e32",
                "label": "Toggle Field",
                "name": "toggle_Field",
                "type": "true_false",
                "instructions": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
                "required": 0,
                "conditional_logic": 0,
                "wrapper": {
                    "width": "33",
                    "class": "",
                    "id": ""
                },
                "message": "",
                "default_value": 0,
                "ui": 1,
                "ui_on_text": "",
                "ui_off_text": ""
            },
            {
                "key": "field_5b59f582f2e31",
                "label": "Checkbox Field",
                "name": "checkbox_field_copy",
                "type": "checkbox",
                "instructions": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse porttitor condimentum nulla id molestie. Mauris faucibus felis id magna lobortis egestas. Donec lacinia mi est, nec gravida urna aliquam at. Etiam sagittis imperdiet accumsan.",
                "required": 0,
                "conditional_logic": [
                    [
                        {
                            "field": "field_5b59f588f2e32",
                            "operator": "==",
                            "value": "1"
                        }
                    ]
                ],
                "wrapper": {
                    "width": "33",
                    "class": "",
                    "id": ""
                },
                "choices": {
                    "Option A": "Option A",
                    "Option B": "Option B",
                    "Option C": "Option C"
                },
                "allow_custom": 0,
                "save_custom": 0,
                "default_value": [],
                "layout": "vertical",
                "toggle": 0,
                "return_format": "value"
            },
            {
                "key": "field_5b59f67850937",
                "label": "Select Field",
                "name": "select_field_copy",
                "type": "select",
                "instructions": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
                "required": 0,
                "conditional_logic": [
                    [
                        {
                            "field": "field_5b59f588f2e32",
                            "operator": "==",
                            "value": "1"
                        }
                    ]
                ],
                "wrapper": {
                    "width": "33",
                    "class": "",
                    "id": ""
                },
                "choices": {
                    "Option A": "Option A",
                    "Option B": "Option B",
                    "Option C": "Option C"
                },
                "default_value": [],
                "allow_null": 0,
                "multiple": 0,
                "ui": 0,
                "ajax": 0,
                "return_format": "value",
                "placeholder": ""
            }
        ],
        "location": [
            [
                {
                    "param": "options_page",
                    "operator": "==",
                    "value": "acf-options-general-options"
                }
            ]
        ],
        "menu_order": 0,
        "position": "normal",
        "style": "default",
        "label_placement": "top",
        "instruction_placement": "label",
        "hide_on_screen": "",
        "active": 1,
        "description": ""
    }
]

I also had this issue. I had two adjacent text fields (width set to 50%) that were within a group field. When adding a label to one of the two fields, ACF added an inline style to both div.acf-fields that set a minimum-height on both. It appears the css was inserted to try to keep the two side by side fields equal height, but since the label had been moved into a tooltip it just resulted in white space.

Hope this helps.

I think I found a solution for this. Please try this version and let me know if it will work for you.

Thanks Thomas

I only did a quick test with it but the new version does appear to have fixed the problem.

Thanks for posting. I still seem to be getting this issue with the latest version unfortunately, maybe it’s specific to the scenario I had described above, here’s how it looks: https://www.dropbox.com/s/wotff22qdg9iugp/Screenshot%202018-12-02%2016.11.35.png?dl=0

For the moment I have corrected by enqueuing an admin CSS file and adding the following hack to overwrite the min-height on the fields:

.acf-fields > .acf-field[style] {
min-height: 0px !important;
}

@candymac Did you checked this with the “latest version” or with the test version I linked in my last post?

@tmconnect the latest version I just grabbed has fixed this issue. Thank You!

Glad, that it is now working…