Visualizzazione dei risultati da 1 a 5 su 5
  1. #1

    FF2 e FF3, HTML validato ma differenze di rendering

    Salve,
    ho notato, in questa pagina di test, che è indicata come valida dal W3C validator:

    http://fsblendorio.netsons.org/test/Videogallery.htm

    ...delle differenze di rendering di Firefox 3 rispetto a Firefox 2, dove il risultato in Firefox 2 è nettamente migliore, e secondo me quello corretto. Ecco come compaiono in questi screenshot:

    Firefox 2
    Firefox 3

    In pratica, in FF3 i vari blocchi di testo (che altro non sono che dei div con proprietà "float: left") risultano "stretti", come se fosse stata indicata una property "width" che in realtà non è impostata.

    Questo problema non si presenta con IE7, IE6, Opera.
    Si presenta invece con Safari e Konqueror.

    Qualcuno conosce il motivo di questo strano comportamento?

    Grazie,
    Francesco.

  2. #2
    Ho semplificato la pagina, eliminando i dettagli che non interessano il problema.
    Il risultato, con lo stesso problema descritto, è possibile vederlo in questi due nuovi screenshot:

    Con Firefox 2
    Con Firefox 3

    Nonostante la semplicità del codice, non riesco a capire il motivo del differente comportamento.

  3. #3
    Ad esempio potresti non aver specificato il font per le celle della tabella
    Fantasupermegafavolipermeramagicultra irresistibili
    4 10 30 100 1001 personaggi insuperabili fantaincredibili ultraimpossibili iperterribili irresistibili!!!

    "... a quell'età ... bastava un dito per fare la pace ..."
    fotine

  4. #4
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,660
    se posti il codice incriminato magari si risolve qualcosa

  5. #5
    Ecco il codice... incriminato:

    codice:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    	<title>Francesco Pazienza - Videogallery - Videogallery</title>
    	
       <link href="Videogallery_files/pm-core.css" rel="stylesheet" type="text/css" />
       <link href="Videogallery_files/layout-triad.css" rel="stylesheet" type="text/css" />
    </head>
    <body style="font-size: 90%; font-family:verdana,arial">
    
    <table id="outer-box" align="center" border="0" cellpadding="0" cellspacing="0">
    <tbody>
    <tr>
     <td id="center-box" valign="top" style="font-family:verdana,arial">
      <div id="contentbox">
        <div id="content">
          <div id="wikitext">
            <div class="lfloat"> 
              <div><span class="lfloat">
                 <a class="wikilink" href="http://fpazienza.netsons.org/Videogallery/VespriSicilianiInverno">
                 [img]Videogallery_files/ist_vespri.jpg[/img]</a></span>
              </div>
              
    
    
                Teatro T. TRAETTA 
    
                Giuseppe Verdi - Titolo dell'opera I Vespri Siciliani (Inverno) Prova1
    
                Orchestra da Camera "Vincenzo  Bellezza"
    dirige l'orchestra il maestro Nomexxxxxx Cognomeyyyyy
                <br clear="all" />
              </p>
            </div>
            
    
    <br clear="all" /></p>
          </div>
        </div>
      </div>
     </td>
    </tr>
    
    </tbody>
    </table>
    </body>
    </html>
    A questo codice sono associati due CSS. Ecco il primo "pm-core.css"
    codice:
    .frame  { border:1px solid #cccccc; padding:4px; background-color:#f9f9f9; }
    .lfloat { float:left; margin-right:0.5em; }
    .rfloat { float:right; margin-left:0.5em; }
    
    ul, ol, pre, dl, p { margin-top:0px; margin-bottom:0px; }
    code { white-space: nowrap; }
    .vspace { margin-top:1.33em; }
    .indent { margin-left:40px; }
    .outdent { margin-left:40px; text-indent:-40px; }
    a.createlinktext { text-decoration:none; border-bottom:1px dotted gray; }
    a.createlink { text-decoration:none; position:relative; top:-0.5em;
      font-weight:bold; font-size:smaller; border-bottom:none; }
    img { border:0px; }
    
      table.markup { border:2px dotted #ccf; width:90%; }
      td.markup1, td.markup2 { padding-left:10px; padding-right:10px; }
      table.vert td.markup1 { border-bottom:1px solid #ccf; }
      table.horiz td.markup1 { width:23em; border-right:1px solid #ccf; }
      table.markup caption { text-align:left; }
      div.faq p, div.faq pre { margin-left:2em; }
      div.faq p.question { margin:1em 0 0.75em 0; font-weight:bold; }
    
    /* vardoc */
    a.varlink { text-decoration:none; }
    Ed ecco il secondo, "layout-triad.css":
    codice:
    html, body { height:100%;  }
    body {  margin:0; padding:0px 0;  }
    .clearer {height:1px; clear:both; margin-top:-1px;}
    #outer-box { width:100%; 
    		height:100%; }
    #header-box { height:1px;  }
    #left-box {}
    #right-box {}
    #footer-box { height:1px; }
    #center-box { padding:3px 3px 0 3px; }
    #rightbar { padding:0px 5px 5px 1px; }
    #sidebar { margin-top:3px; 
    		   padding:0 3px; }
    
    #header { padding:5px 5px 5px 10px; 
    		  margin:0;
    		  min-height:1%; }
    
    #topnavbox {margin:0; padding:0; }
    #topnav { margin:0; padding:0; min-height:1.5em;}
    .togglebox  { cursor:pointer;
    			  font-size:.85em; 
    			  padding:0; margin-top:1px; }
    #toggleright { float:right; margin:0 0 1px 0px; }
    #toggleleft  { float:left;	margin:0 0 1px 0px; }
    #content { padding:1em; }
    .pagegroup {  
    		margin:0;		 
    		padding:5px 1em 0 1em; 
    		}
    .pagetitle { 
    		margin:0.2em 1em;
    		padding:0.3em 0; 
    		border-top: 3px double #ccc; 
    		border-bottom: 3px double #ccc;
    		}
    h1,h2,h3,h4,h5,h6 { margin:0; }
    #header a, #titlebar a, #pagegroup a, #pagetitle a {text-decoration:none;}
    #footnav { padding:7px 5px 15px 5px;   }
    #footer { padding:5px 1em; }

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.