Ciao,

Tempo fa avevo postato qui per un problema (poi risolto) con un modal pop up.
Tuttavia in seguito ad alcune presentazioni fatti con beamer a risoluzione 768px il dialog (.Dialog) rimane parzialmente tagliato dalla pagina del browser.

Il problema è che posso fare lo scroll della pagina sottostante (tramite .DialogBack), posso anche fare lo scroll del contenuto del dialog, ma il problema è che riducendo l'altezza della pagina, il div dialog non si riduce di conseguenza, ma rimane fisso, per cui la porzione nascosta sotto la finestra del browser non è visibile.

Cosa sbaglio e come potrei risolvere cio' in modo che anche a basse risoluzioni il dailog sia interamente fruibile?

Grazie


codice:
<div class="DialogBack">
  <div class="DialogHeader">
     <h1> ....   </h1>
  </div>
  
  <div class="DialogBody DialogBodyFullWidth">
      <div class="DialogBodyContent">
                     .....
      </div>
  </div>

   <div class="DialogFooter">  </div>
</div>


.DialogBack
{
	position: fixed; 
	top:0;
	left:0;	
	width: 100%;
	min-height: 100%;    
	background: Transparent url(images/Backgrounds/maskBG.png) top left repeat;
	z-index: 29 !important;
}

.Dialog
{
	position: relative;	
	top: 50px; 	
	max-width:700px;
	margin: 0 auto;	
	padding:0;
	z-index:30 !important;	

}
 
.DialogBody
{	
	clear:both;  
	padding:0;
}


.DialogBodyFullWidth
{
	padding:0 0 18px 0;
	margin:0;
	overflow:auto;
	max-height:500px;   		
}

.DialogBodyFullWidth .DialogBodyContent {	width:97%; }

.DialogBodyContent	
{	
	float:left;
	width:97%;
	min-height:0;
	padding-top:5px;
	margin:0;
}

.DialogFooter
{	
	clear:both;
	width:100%;		
}