Dropdown Position Issue with Select Field on RTL Page

  • Resolved minamt

    (@minamt)


    10 months, 1 week ago

    Hello,

    I’ve encountered an issue with the select dropdown field in a form I created using the Forminator plugin. I’ve configured the field using the CSV bulk edit feature for the options, and the form is embedded on an RTL (Right-to-Left) page built with the Divi theme.

    The problem is that when I click on the select field, the dropdown menu does not appear directly below the field as expected. Instead, it appears offset to the other side of the screen, making the UI look broken and confusing for users. I’ve attached a screenshot to illustrate the issue. https://ibb.co/67587nzh

    Could you please assist me in resolving this?

Viewing 6 replies - 1 through 6 (of 6 total)
  • Kris – WPMU DEV Support

    (@wpmudevsupport13)

    10 months, 1 week ago

    Hi @minamt

    I hope you are doing well today.

    This is a known issue, which was already reported to our developers. Future updates will contain a fix. As for now, please add the below code in WP Dashboard -> Customize -> Appearance -> Additional CSS section:

    body.rtl .select2-results__options li,
    body.rtl .forminator-field * {
        direction: rtl;
        text-align: right;
    }

    Kind Regards,
    Kris

    Thread Starter minamt

    (@minamt)

    10 months, 1 week ago

    Hi,
    I’ve added the code you provided me but the problem is still not resolved, the select menu is still on the offset on the left side. You can check the screenshot here: https://ibb.co/rfdmJqt6

    Plugin Support Nebu John – WPMU DEV Support

    (@wpmudevsupport14)

    10 months, 1 week ago

    Hi @minamt,

    Can you please confirm if all the cache on this website was cleared once the CSS was added?

    Wouldn’t you mind please sharing the URL where you observe the issue so that we can take a closer look for you?

    If you are not comfortable sharing the URL publicly here, please email us at [email protected] using the following template.

    Subject: ATTN: WPMU DEV support - wp.org

    Please send:
    – Link to your WordPress site
    – Link back to this thread for reference (https://ww.wp.xz.cn/support/topic/dropdown-position-issue-with-select-field-on-rtl-page/)
    – Any other relevant URLs/info`

    To ensure we don’t miss your email, please let us know here once you’ve emailed us, and make sure you use “ATTN: WPMU DEV support – wp.org” as the email subject.

    Best Regards,
    Nebu John

    Thread Starter minamt

    (@minamt)

    10 months, 1 week ago

    Hi,
    Yes the cache has been cleared, same issue.
    here is the page where I have tested the form and found the issue: https://www.afakalgeria.com/ar/__trashed-2/

    Plugin Support Jair – WPMU DEV Support

    (@wpmudevsupport15)

    10 months, 1 week ago

    Hello @minamt

    Thanks for the information. In this case, it seems the dropdownmenu should be fixed by just adding this CSS code in the WP Dashboard -> Customize -> Appearance -> Additional CSS section:

    .select2-container.forminator-select.forminator-select-dropdown-container--open.select2-container--open {
    width: auto !important;
    }

    Please try it and let us know how it works.

    Kind regards,
    Jair.

    Plugin Support Dmytro – WPMU DEV Support

    (@wpmudevsupport16)

    9 months, 4 weeks ago

    Hello @minamt,

    I hope that our suggestions helped addressing the issue.

    Since we haven’t heard from you for a while, I’ll be marking this thread as resolved for now. Please feel free to reopen it, in case you still need our assistance.

    Best Regards,
    Dmytro

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Dropdown Position Issue with Select Field on RTL Page’ is closed to new replies.