Search code examples
asp.netcssmobilemodalpopupextender

Mobile ModalPopupExtender?


I'm running into an issue with the ModalPopupExtender when displayed on a small screen device. The modals height does not rescale to fit within the viewable window. Because it is centered the top and bottom of the modal gets clipped. Trying to scroll it only scrolls the underlying page not the modal. Anyone run into this or have suggestions on a fix?


Solution

  • I decided to handle it using a series of media queries....

    .sModalCnt {max-height:480px;overflow-y:auto}
    @media only screen and (max-height:600px) {
      .sModalCnt {max-height:380px}
    }
    @media only screen and (max-height:500px) {
      .sModalCnt {max-height:280px}
    }
    @media only screen and (max-height:400px) {
      .sModalCnt {max-height:180px}
    }
    @media only screen and (max-height:300px) {
      .sModalCnt {max-height:80px}
    }