explorer e firefox - visualizzazioni diverse

**dardo** · 08-02-2007, 17:30

ciao
ho un problema che mi sta facendo venire il mal di testa.
in pratica mentre navigo in un servizio web explorer visualizza tutto bene mentre firefox non mi carica le immaggini per simulare dei bordi curvi nell'header della pagina.
ho salvato la pagina localmente sia css che html in modo da eliminare tutti i tag di struts e vari jsp.
la cosa assurda è che al momento che seleziono un elemento di una combo la pagina fa un'ulteriore richiesta al server e va in errore e qui viene il bello explorer si estende orizzontalmente in modo pazzesco mente firefox va talmente bene che visualizza l'header con i bordi curvi.
per l'estensione orizzontale di explorer avevo "risolto" aggiungendo all'inizio di pagina
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
ma non riesco a capire il perchè.

ecco il codice della pagina con le porzioni di css:

codice:

<html xmlns="http://www.w3.org/1999/xhtml" lang="it" xml:lang="it">     
<head>
    <meta http-equiv="Expires" content="0" />
    <title>Progetto PEOPLE</title>
    <link rel="stylesheet" type="text/css" href="people.css" />
<link rel="stylesheet" type="text/css" href="people_01.css" />
 
</head>
<body>
	<table cellspacing="0" width="100%" border="0">
      	<tr><td colspan="2">
			<table border="0" cellpadding="0" cellspacing="0" width="100%" class="headerP">
    				<tr>
					<td class="hd_left_topP"></td>
        				<td class="comuneP">
            				<h2>Comune di Prova</h2>
						<span class="logoP">Titolo2
descrizione..</span>            
        				</td>
        				<td class="hd_right_topP"></td>
    				</tr>
    				<tr>
        				<td colspan="3" class="linklistP">         
        				</td>
    				</tr>
    				<tr>
        				<td class="hd_left_bottomP"></td>
        				<td class="hd_mid_bottomP"></td>
        				<td class="hd_right_bottomP"></td>
    				</tr>
			</table>	        			
        	</td></tr>
        	<tr><td>
	      	<table class="box_nav" cellspacing="0">
    				<tr>
   					<td class="box_nav_left_top"></td>    
					<td rowspan="2" class="path" > 							
						home|Servizi										
					</td>
    					<td align="right" class="path" rowspan="2">   		
	    					Le mie praticheLogin			
      				</td>
  					<td class="box_nav_right_top"></td>      	
				</tr>	
				<tr>
   					<td class="box_nav_left_bottom"></td>    
  					<td class="box_nav_right_bottom"></td>      	
				</tr>
			</table>
        	</td></tr>
        	<tr><td valign="top">
        		<table border="0" width="100%"> 
				<tr><td>
								
				</td>
				<td>
				
	            </td></tr>
            </table>
        </td></tr>
    </table>
</body>
</html>

qui ci sono i css:

people_01.css

codice:

/**************************************************************************/
/*classi generali*/ 
/**************************************************************************/

body {font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; margin: 10px; padding: 0; background-color: #fff; color: 444;}
h1{font-size: 16px; margin-top: 0px; margin-bottom: 2px; height: 12px; padding-top: 0px; padding-bottom: 0px;}
h3{font-size: 13px; color: black; margin-top: 0px; margin-right: 0px; margin-bottom: 2px; height: 12px; padding-top: 0px; padding-bottom: 0px;}



/**************************************************************************/
/*header*/ 
/**************************************************************************/

.logoP{color: blue; font-size: 15px; display: inline; float: right; margin-top: 0px; font-size: 12px;}
div#logoP{position: absolute; top: 10px; left: 20px; z-index: 1;}	  
div#logoP img{border: 0; height: 85px;}	
table.headerP{background: url(/people/img/back_hd_mid.gif) top repeat-x; margin-bottom: 15px;}
td.comuneP{width: 99%; padding-left: 130px;}
td.comuneP h2{color: #005094; font-size: 18px; display: inline; float: left; margin-top: 0px;}
td.linklistP{background-color: #005094; color: #fff; padding-left: 20%; height: 10px;}
td.hd_left_topP{width:10px; height: 59px; background: #fff url(/people/img/back_hd_left_top.gif) left no-repeat;}
td.hd_right_topP{width: 10px; background: #fff url(/people/img/back_hd_right_top.gif) right no-repeat;}
td.hd_left_bottomP{width: 10px; height: 12px; background: #fff url(/people/img/back_hd_left_bottom.gif) left no-repeat;}
td.hd_mid_bottomP{background: #fff url(/people/img/back_hd_mid_bottom.gif) repeat-x;}
td.hd_right_bottomP{width: 10px;background:#fff url(/people/img/back_hd_right_bottom.gif) right no-repeat;}
td.titleP{border-bottom: 1px solid #5AA1DE;}
td.box_contestualePDX{border-bottom:1px solid #EAEAEA;padding:10px 10px 10px 10px; border-left:1px solid #EAEAEA; }
td.box_contestualePDX p{margin:0;font-weight:bold;}
td.box_contestualePSX{border-bottom:1px solid #EAEAEA; border-right:1px solid #EAEAEA; padding:10px 10px 10px 10px;}
td.box_contestualePSX p{margin:0;font-weight:bold;}
td.titlePP{border-bottom: 1px solid #5AA1DE; margin: 5px,5px,5px,5px;}

codice:

table.box_nav {
	background-color:#005094;
	color:#fff;
	margin: 2px 2px 4px 2px;
	width: 100%;
}

td.box_nav_left_top{width:10px;background:url(/people/img/back_nav_left_top.gif) top left no-repeat;}
td.box_nav_right_top{width:10px;background:url(/people/img/back_nav_right_top.gif) top right no-repeat;}
td.box_nav_left_bottom{width:10px;background:url(/people/img/back_nav_left_bottom.gif) bottom left no-repeat;}
td.box_nav_right_bottom{width:10px;background:url(/people/img/back_nav_right_bottom.gif) bottom right no-repeat;}

table.box_nav input.btnLink {
	font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;
	background-color:#005094;
	border: 0px none white;
	color:white;
	text-decoration: underline;
	cursor: pointer;
	font-weight:bold;
	padding:0 .25em 0 .25em;
	overflow:visible;
	width:auto;
}

table.box_nav input:hover.btnLink {
	color:#d2d7fe;
}

table.box_nav span.btnLinkDisabled {
	font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;
	color:#d7d7d7;
	cursor: pointer;
	font-weight:bold;
	padding: 0 .25em 0 .25em;
}

table.box_nav a {
	font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size:100%;
	color:white;
	text-decoration: underline;
	cursor: pointer;
	font-weight:bold;
	padding:0 .25em 0 .25em;
}

table.box_nav a:hover {
	color:#d2d7fe;
}

/* testi */
span.error {
	display: block; 
	margin: 3px; 
	padding: 5px; 
	border: 2px dotted #990000; 
	color: black;
	background-color:#fff;
}
span.warning {
	display: block; 
	margin: 3px; 
	padding: 5px; 
	border: 2px dotted #006600; 
	background-color:#fff;	
	color: #339933;
}

.txtNormal,.txtNormal:link,.txtNormal:hover,.txtNormal:visited{
	font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-decoration: none;
}

**dardo** · 12-02-2007, 10:46

ciao

ho risolto il problema...
scrivo che magari interessa a qualcuno:

<table cellspacing="0" width="100%" border="0">
la riga sopra dava fastidio in quanto lo spazio tra celle lo dovevo dichiarare nei css.
ho trovato le pagine di errore che caricava e ho aggiunto a la dichiarazione del doctype, e ora la visualizzazione delle pagine va bene.
Naturalmente mi sono aiutato con altri post precedenti in particolare su come dichiarare lo spacing nei css sia per firefox che per explorer:

border-spacing: 0;
border-collapse:collapse;

l'effetto della tabbella con bordi curvi non è perfetta con firefox ma per ora mi accontento

Discussione: explorer e firefox - visualizzazioni diverse

Strumenti discussione

Ricerca discussione

Visualizza

explorer e firefox - visualizzazioni diverse

Permessi di invio