모달 높이를 조정하는 방법은 무엇입니까?

장치를 사용하여 모달 페이지를 여는 데 문제가 있습니다. 문제는 갑자기 나타나기보다는 페이지를 채우고 있다는 것입니다. 무엇이 문제일까요? 모달은 웹 브라우저에서 나타나지만 장치에서 열리지 만 페이지를 채 웁니다. 이 부분을 어떻게 해결할 수 있습니까? 베스트 감사합니다 variable.scss 타고 모달의 기본 CSS 이상모달 높이를 조정하는 방법은 무엇입니까?

import {Component} from '@angular/core'; 
import {Network, Toast} from "ionic-native"; 
import {ModalPagePage} from '../modal-page/modal-page'; 
import {NavController, Platform,ModalController} from 'ionic-angular'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    public people: Array<Object>; 
    onDevice: boolean; 


    constructor(public navCtrl: NavController, public modalCtrl: ModalController) { 


    this.platform.ready().then(() => { 

     this.onDevice = this.platform.is('cordova'); 



    }); 

    } 




    presentProfileModal() { 
    let profileModal = this.modalCtrl.create(ModalPagePage); 

    profileModal.present(); 
    } 




}

출처

2017-02-13 James Java Card

모달 표현은 CSS에서 설정되므로 도움이 필요하면 관련 HTML 및 CSS를 붙여 넣어야합니다. – codeepic

저는 이오닉이 이것을 의도적으로했다고 생각합니다. 모달이 작은 장치에서 전체 화면을 갖게하는 것이 좋은 UX이기 때문입니다. –

@codeepic modal-page.scss는 다음과 같습니다. page-modal-page { width : 50 %; 높이 : 50 %; }}에 모달-page.html은 다음과 같습니다 <이온 제목 주> 내 사용자 정의 모달 <이온 버튼을 끝> <버튼 "() 기각"(클릭) => 닫기 <이온 함량 패딩> –

.modal-wrapper { 
    position: absolute !important; 
    width: 93vw !important; 
    height: 260px !important; 
    top: 0 !important; 
    bottom: 0 !important; 
    left: 0 !important; 
    right: 0 !important; 
    margin: auto !important; 
} 

.modal .backdrop { 
    display: block !important; 
}

출처

2017-02-13 09:34:47 Naveen

모달 높이를 조정하는 방법은 무엇입니까?

답변

관련 문제