Всплывающее окно в Ionic 3

Question

Я уже потратил много времени, пытаясь придать своему поповеру вид, который я хочу.

всплывающее окно в настоящее время находится в центре экрана. но я хочу, чтобы он был на 50 пикселей сверху и шириной, равной экрану устройства. сейчас ширина кажется фиксированным номером, который я не могу изменить.

Я не хочу делать это глобально, поэтому мне нужно только для определенного всплывающего окна. Текущий код для запуска:

 let data:any;
 let options = {cssClass : 'speech-popup'};
 let popover = this.popoverCtrl.create(ProcessSpeechPopup, data, options);
 popover.present();

всплывающее окно css:

 .speech-popup {
      width: 100%;
      top:68px;
    }

всплывающее окно HTML:

@Component({
  template: `
            <div padding style="background: rgba(255, 255, 255, 0.5);height:100%;">
                <h1 *ngIf="showDoYouMean == true">Do you mean?</h1>
            </div>
            `
})

Answer 1

Вам нужно иметь position: absolute; использовать атрибут верхнего CSS. Ширина, вероятно, ограничена родителем всплывающих окон. Попробуй это:

.speech-popup {
  position: absolute;
  width: 100vw;
  top:68px;
}