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 that you have read and understand our privacy policy and code of conduct.

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