CSS -IONIC 2. Отображение полного значения ионного ввода или ионного параметра на экране после выбора

Я пытаюсь отобразить полный текст значения, выбранного в параметре ion-input или ion-option. Проблема в том, что название значения отображается только наполовину. Я хотел бы поместить текстовый перенос или несколько кодов css, которые могли бы показать мне полный текст из выбранного значения.

Здесь я позволяю изображению отображать мою проблему:

введите здесь описание изображения

Как видите, значение Special Acade не отображается полностью, и для него достаточно места.

Код:

<ion-item *ngIf="categorySelected " > 
   <ion-label > level 2: </ion-label> 
   <ion-select interface="popover" [(ngModel)]="subCategorySelected" (ngModelChange)="setSubCategorySelected(subCategorySelected)‌​" text-wrap> 
      <ion-option *ngFor="let x of subCategory">{{x.name}}</ion-option> 
   </ion-select> 
</ion-item>

Как я мог это решить?

Большое спасибо!


ionic-framework angular input css
person Joan    schedule 22.12.2017    source источник
comment
Укажите здесь свой соответствующий код .. прочтите минимальный воспроизводимый пример   -  person Suraj Rao    schedule 23.12.2017
comment
Привет @SurajRao, вы правы, я позволил себе код:   -  person Joan    schedule 23.12.2017
comment
Я предполагаю, что если бы я мог изменить ширину с помощью ионной метки или чего-то в этом роде, пространство для ионного выбора / ввода было бы лучше и больше.   -  person Joan    schedule 23.12.2017
comment
да .. вам придется переопределить некоторые css   -  person Suraj Rao    schedule 23.12.2017

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете увеличить ширину выделенного текста:

#myDivId .select-text{
  min-width: 50px;
}

Или уменьшите пространство, занимаемое этикеткой

#myDivId ion-label{
  max-width: 50px;
}
person VRZ78    schedule 05.02.2018