0

Вылазит длинный текст....

Изображение

Пробовал white-space: normal, но тогда строка начинается с абзаца, а мне нужно чтобы текст был вряд и не вылазил...

Сам код:

<select size="1" autocomplete="shipping country" data-backup="country" class="field__input field__input--select" aria-required="true" name="order_delivery_method" id="checkout_shipping_address_country">
  <option>Новая Почта (Оплата при получении 1233333333333)</option>
  <option>Новая Почта (Полная предоплата)</option>
  <option>Новая Почта (Частичная предоплата)</option>
</select>

14
  • Вопросы с просьбами помочь с отладкой («почему этот код не работает?») должны включать желаемое поведение, конкретную проблему или ошибку и минимальный код для её воспроизведения прямо в вопросе.
    – Alex
    26 ноя 2017 в 21:05
  • Вообще ничего не понять. Кода нет, данных нет, текст не вмещается в блок или в input таблицы стилей заданы или нет. Если родитель ограничен по ширине то текст длиннее родителя не войдет. 26 ноя 2017 в 21:06
  • @Alex добавил код! 26 ноя 2017 в 21:08
  • @RuslanSemenov добавил код! 26 ноя 2017 в 21:08
  • @ВасилийПупкин в добавленном коде проблема не наблюдается. добавьте больше информации, чтобы воспроизвести Вашу проблему. предполагаем, что Вы используете плагин.
    – Alex
    26 ноя 2017 в 21:12

2 ответа 2

2

Добавьте правило:

.floating-labels .field--show-floating-label .field__input{
   padding-right: 40px;
}
8
  • это нужно найти класс .floating-labels .field--show-floating-label .field__input{ и добавить туда паддинг или же создать класс? 26 ноя 2017 в 21:28
  • либо найти это правило и добавить в него либо в конец файла стилей добавить данное правило
    – Alex
    26 ноя 2017 в 21:31
  • посмотрите как на телефонном экране вылазит option, разве так и должно быть? webmark.com.ua/mobile/… 26 ноя 2017 в 21:33
  • @ВасилийПупкин вы с телефона посмотрите
    – Alex
    26 ноя 2017 в 21:34
  • с телефона нет возможности, по этому приходится использовать сервис webmark 26 ноя 2017 в 21:36
1

Вот как пример, использования вместо select option

body {
  background: skyblue;
}

div {
  background: white;
  max-width: 200px;
}
<div>

  <input type="radio" name="delivery" value="val1"> Очень длинный текст с описанием, и всем, что вашей деше угодно. Лорем тут жалко не поддерживается :)<br>
  <input type="radio" name="delivery" value="val2"> Второй<br>
  <input type="radio" name="delivery" value="val3"> Третий<br>

</div>

4
  • где же вы там radio увидели?
    – Alex
    26 ноя 2017 в 21:28
  • Его там нет, я предлагаю выход, при длинных текстах использование radio вместо длинного option 26 ноя 2017 в 21:29
  • видимо вы не поняли, что хотел автор
    – Alex
    26 ноя 2017 в 21:33
  • 1
    Да, я об этом и сказал, поэтому подтвердил ваше решение. 26 ноя 2017 в 21:34

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.