Text wrapping on form labels

@maiakae wrote:

Hello everybody and thanks to the creators, for this beautiful framework!

This probably is a silly question, but couldn't find no solution reading the manuals or searching by myself:

I'm developing a simple application in which the user has to fill a form with many questions regarding the state of a facility or mechanical device. Summing up, many of the questions are quite long, and the label of the form (stacked, floating... whatever) won't fit them inside a tablet device screen width. I tried using item-text-wrap but the result is awful, cramming all the text to the left and not homogeneously spreading it as it happens inside a panel or list.

I have made no changes to the original css, I've just started to use the framework.

There's an example of the kind of questions I'm facing. Try adding item-text-wrap to the form, label or even span elements and you'll see what I'm talking about.

            <form class="list">
              <label class="item item-input item-stacked-label">
                <span class="input-label">3.4.- Esta se encuentra bajo tubo, canalización prefabricada o con conductores aislados con cubierta metálica.</span>
                <input type="text" placeholder="John">
              </label>
              <label class="item item-input item-stacked-label">
                <span class="input-label">Last Name</span>
                <input type="text" placeholder="Suhr">
              </label>
              <label class="item item-input item-stacked-label">
                <span class="input-label">Email</span>
                <input type="text" placeholder="john@suhr.com">
              </label>
            </form>

Is there any solution for this?

Thanks in advance,
Pedro.

Posts: 1

Participants: 1

Read full topic