p:Dialog not correct working on mobile devices

[vished]

Dear all,

The dialog is not correct working for mobile devices.
I´ve checked it on my IPhone (Safari).

If the height is bigger than the screen, I cannot scroll down. At the bottom there are some buttons available. So this means I cannot use any buttons of this.
How can I solve this?

Here my dialog:

Code: Select all

<p:dialog id="sharingDialog" widgetVar="sharingDialog" draggable="false"
			appendToBody="false" position="center" header="Test"
			showHeader="true" maximizable="false" responsive="true" 
			minimizable="false" dynamic="false" modal="true" resizable="false"
			closable="true" closeOnEscape="true">

			<h:form id="sharingForm">

				<div class="description-no-padding description-success">Test....</div>

				<h:panelGroup>
					<p:panelGrid columnClasses="ui-grid-col-3,ui-grid-col-9"
						columns="2" layout="grid">
						<p:outputLabel value="Test:" />
						<h:panelGroup>
							<h:outputText value="#{galleryEditController.shoppingCardPrice}">
								<f:convertNumber groupingUsed="true" minFractionDigits="2"
									locale="#{localeBean.locale}" />
							</h:outputText>
							<h:outputText
								value=" #{applicationController.currentJob.currency}" />
						</h:panelGroup>

					</p:panelGrid>
				</h:panelGroup>


				<div class="EmptyBox10"></div>
				<div class="Separator"></div>

				<h:panelGroup>

					<p:commandButton value="Abbrechen" icon="fa fa-close"
						styleClass="Fs15 White RaisedButton"
						style="margin-right: 10px; margin-bottom: 10px;"
						onclick="PF('sharingDialog').hide()" />

					<p:commandButton value="Test"
						actionListener="#{galleryEditController.doSaveShoppingCard('SHARING', false, galleryEditController.selectedStorageAttachment)}"
						styleClass="GreenButton Fs15 White RaisedButton"
						icon="fa fa-shopping-cart" oncomplete="PF('sharingDialog').hide()"
						ajax="true" />
				</h:panelGroup>
			</h:form>
		</p:dialog>

[mert.sincan]

I think you can give a value to height of dialog content. Exp;

Code: Select all

.sharingDialogClass .ui-dialog-content{
     height: 100px !important;
}

//Xhtml
<p:dialog id="sharingDialog" styleClass="sharingDialogClass" ...>