Rooms Modules Wrap Contact Form dropdown text

Viewing 4 reply threads
    • #1269
      Ann Chovey
      Participant
        @ann
        Up
        0
        Down
        ::

        I’ve got a dropdown in a Divi form where the text doesn’t fit on one line on mobile. Does anyone know how to make the text wrap?

        Attachments:
      • #1271
        Hugh N. Cry
        Participant
          @hugh
          Up
          0
          Down
          ::

          Without a URL we are guessing. Use the browser dev tools to inspect the text wrapper to find what is causing the issue.

          • #1272
            Ann Chovey
            Participant
              @ann
              Up
              0
              Down
              ::

              I think this is normal behavior, so I’m just wondering if anyone knows how to do it in general. I have changed the height of the field to provide ample space but it looks like Divi just outputs dropdown text on one line. I tried adding a overflow-wrap property but it didn’t help.

              • #1273
                Hugh N. Cry
                Participant
                  @hugh
                  Up
                  0
                  Down
                  ::

                  Ok well we need a URL to help.

                  • #1274
                    Ann Chovey
                    Participant
                      @ann
                      Up
                      0
                      Down
                      ::

                      Tap the “Schedule Consultation” button and the form comes up.

                      https://jonathang53.sg-host.com/unleash-coaching/

                       

                       

                    • #1275
                      Hugh N. Cry
                      Participant
                        @hugh
                        Up
                        0
                        Down
                        ::

                        You appear to have written your form questions inside the form fields instead of using the intended field titles. The text inside the fields are meant to be extra prompts; not the main question. Remove the “display: none” on the titles, and the text will wrap as it should (see screenshot).

                        Attachments:
                      • #1277
                        Ann Chovey
                        Participant
                          @ann
                          Up
                          0
                          Down
                          ::

                          I’ll give that a shot. Thank you so much!

                  • #1278
                    Ann Chovey
                    Participant
                      @ann
                      Up
                      0
                      Down
                      ::

                      As I originally thought, I am indeed using the field titles. I don’t have any custom CSS affecting them on this site, so I’m really puzzled as to what’s going on as I’m just using Divi’s standard behavior. Any further ideas? Thanks again for your help!

                      Attachments:
                    • #1280
                      Terry Hale
                      Keymaster
                        @mizagorn
                        Up
                        0
                        Down
                        ::

                        Believe it or not, the Divi code for the contact form is actually doing that on purpose. It writes a label (hidden) for the dropdown, but instead of making the label on a dropdown visible, it sets the first dropdown option as the title, much like it sets the placeholder for text fields as the title.

                        The best you can do without waiting for ET to change this behavior is to style the label for the dropdown as visible. But that just duplicates the option title text (and moves the down arrow up!).

                        With making the label visible, moving the down arrow down, and a bit of jQuery to remove the title option, it could be fixed.

                      • #1281
                        Terry Hale
                        Keymaster
                          @mizagorn
                          Up
                          0
                          Down
                          ::

                          Also, there doesn’t seem to be a CSS way to wrap a select option without using JavaScript. (That I’ve been able to find.)

                      Viewing 4 reply threads
                      • You must be logged in to reply to this topic.