Autore Topic: FF e CSS ...aiuuuuto. (Letto 3862 volte)

felicelibero · « **il:** 27 Gennaio 2005 15:02:15 »

Salve a tutti,
ho un problema parecchio strano, non me ne ero mai accorto prima , praticamente e' come se FF ignorasse i CSS , sto riaprendo tutte le pagine che ho realizzato utilizzando i CSS con la funzione "aumenta carattere" e non c'e' n'e' una che me lo mantiene....... i caratteri si ingrandiscono...e la pagina si spacca, ovvio. ( da notare che il puzzolente IE visualizza le pagine correttamente....

)

e' normale e sono io che non lo sapevo o cosa potrebbe essere?

fatemi sapere, che sto incasinato di brutto
salutoni

iacchi · « **Risposta #1 il:** 27 Gennaio 2005 17:18:03 »

Ci potresti postare un po' di codice o l'indirizzo delle pagine? Senza vedere niente è difficile aiutarti.
Intanto sposto in evangelizzazione

felicelibero · « **Risposta #2 il:** 27 Gennaio 2005 18:33:23 »

e vai! arrivano i nostri !:-)

ciao Iacchi che bello risentirti , come va? Spero bene.......SI bene, grazie e tu ?Pure io grazie. .bella così. (faccio tutto io cosi' non ti mando OT

ti metto un esempio di codice di una pagina

Codice: [Seleziona]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.hosting {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	padding-left: 20px;
	padding-top: 10px;
	background-image: url(immagini/pcbg.jpg);
	background-repeat: no-repeat;
}
.convenienza {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-left: 25px;
	padding-top: 7px;
	font-weight: bolder;
	color: #000066;
}
.registra {
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	font-size: 12px;
}

.design {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-top: 7px;
	padding-left: 10px;
	background-image: url(immagini/eye2.jpg);
	background-repeat: no-repeat;
}

.designsx {
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 7px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 16px;
	font-size: 12px;
	color: #9999CC;
}

.designdx {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-top: 7px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 4px;
	line-height: 20px;
	text-align: left;
	background-repeat: no-repeat;
	background-attachment: fixed;
	float: no;
}

.tabsx {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #333366;
}

.tabdx {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333366;
}

.tab2 {
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #333366;
	border-left-color: #333366;
}
.datacenter {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding-left: 20px;
}
.hostab {
	background-image: url(immagini/indexbg_r1_c2.png);
	background-repeat: no-repeat;
}

.domtab {
	background-image: url(immagini/indexbg_r1_c5.png);
	background-repeat: no-repeat;
}

.destab {
	background-image: url(immagini/indexbg_r1_c8.png);
	background-repeat: no-repeat;
}

.spacetab {
	background-image: url(immagini/tabbg.png);
}
.hosting2 {
	background-image: url(immagini/bgcellablu1.jpg);
	background-repeat: repeat-y;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding-top: 6px;
	padding-left: 18px;
	padding-right: 10px;
}
-->
</style>
</head>

<body bgcolor="#d7d7e6" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  
  <tr> 
    <td width="75" height="325" valign="top" class="tabsx"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="spacetab">
        <tr> 
          <td width="12" height="325">&nbsp;</td>
        </tr>
      </table></td>
    <td width="251" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="hostab">
        <!--DWLayoutTable-->
        <tr> 
          <td width="254" height="33" valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
        </tr>
        <tr> 
          <td height="123" valign="top" class="hosting"><font color="#333366"> 
            Il primo Web Hosting italiano <br>
            &quot;no limits&quot;, di alta qualita', a<br>
            prezzi competitivi e con la <br>
            comodita' del <strong>Cash &amp; Carry</strong> !<br>
            Con ZenHosting.net e' tutto<br>
            incluso, anche la tranquilita'. <br>
            <font color="#FF0000">&gt;<strong> Scopri la convenienza</strong></font></font></td>
        </tr>
        <tr> 
          <td height="7" valign="top"><img src="immagini/spacecell.png" width="251" height="7"></td>
        </tr>
        <tr> 
          <td height="130" align="left" valign="top" class="hosting2"><img src="immagini/assis.jpg" width="118" height="79"> 
            ... <img src="immagini/garanz.jpg" width="69" height="56" align="top" ><br>
            <font color="#CCCCCC">Illimitati: Domini, Subdomini-E-mail-FTP ecc <br>
            Cpanel 9.5 - Fantastico ( +50 Software gratis)<br>
            Uptime 99,9% - Datacenter &quot;thePlanet&quot;</font></td>
        </tr>
        <tr> 
          <td height="37" valign="top"><img src="immagini/daspazio.png" width="238" height="14" hspace="3" vspace="5" align="top"></td>
        </tr>
      </table></td>
    <td width="135" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="spacetab">
        
        <tr> 
          <td width="18" height="325">&nbsp;</td>
        </tr>
      </table></td>
    <td width="249" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="domtab">
        <!--DWLayoutTable-->
        <tr> 
          <td height="30" colspan="2" valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
        </tr>
        <tr> 
          <td width="167" height="96" valign="top" class="registra">Registrazione 
            Domini <br>
            ( accreditati ICANN), nelle <br>
            principali estensioni<br>
            Internazionali a prezzi <br>
            convenienti ed in piu' molti<br>
            altri utili servizi aggiuntivi. </td>
          <td width="89" valign="top"> <div align="left"><img src="immagini/3world.jpg" width="74" height="78" vspace="7"></div></td>
        </tr>
        <tr> 
          <td height="43" colspan="2" valign="top" class="registra">Trasferimenti, 
            backorder, prenotazioni, <br>
            valutazioni ecc.</td>
        </tr>
        <tr> 
          <td height="4" colspan="2" valign="top"><img src="immagini/spacecell2.png" width="249" height="4"></td>
        </tr>
        <tr> 
          <td height="157" colspan="2" valign="top" class="registra"><p align="left">Clicca 
              sull' immagine per verificare se il <br>
              nome di dominio che desideri registrare<br>
              e' disponibile.<br>
              <br>
              <img src="immagini/domanim.gif" width="138" height="64" hspace="40" align="absmiddle"></p></td>
        </tr>
      </table></td>
    <td width="92" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="spacetab">
        <tr> 
          <td width="21" height="325">&nbsp;</td>
        </tr>
      </table></td>
    <td width="252" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="destab">
        <!--DWLayoutTable-->
        <tr> 
          <td height="30" colspan="2" valign="top"><!--DWLayoutEmptyCell-->&nbsp;</td>
        </tr>
        <tr> 
          <td height="104" colspan="2" valign="top" class="design">Servizi professionali<br>
            per presentarsi <br>
            sul Web in<br>
            maniera efficace<br>
            ed elegante.</td>
        </tr>
        <tr> 
          <td width="119" height="153" valign="top" class="designsx"><font color="#FFFFFF"><strong>Web 
            templates<br>
            </strong><font color="#333333">Pronti per l'uso<br>
            Personalizzati<br>
            <br>
            <font color="#FFFFFF"><strong>Illustrazioni </strong></font><br>
            Icone<br>
            Foto<br>
            Digital art<br>
            </font></font></td>
          <td width="132" valign="top" class="designdx"><strong><font color="#FFFFFF"> 
            Progettazione siti<br>
            Nomi di Dominio<br>
            Nomi di prodotti <br>
            Marchi <br>
            Logo <br>
            Slogan<br>
            Idee creative</font></strong></td>
          </tr>
        <tr valign="bottom"> 
          <td height="6" colspan="2" valign="top"><img src="immagini/spacecell3.png" width="252" height="6"></td>
        </tr>
        <tr valign="bottom"> 
          <td height="37" colspan="2" valign="top"> <div align="left"><img src="immagini/daforma.png" width="237" height="19" hspace="5"></div></td>
        </tr>
      </table></td>
    <td width="2" valign="top" class="tabdx"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="spacetab">
        <tr> 
          <td width="14" height="325">&nbsp;</td>
        </tr>
      </table></td>
  </tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="tab2">
  
  <tr> 
    <td width="1048" height="22">&nbsp;</td>
  </tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
  
  <tr> 
    <td width="24" height="24" valign="top"><img src="immagini/indexbg_r3_c1.png" width="24" height="24"></td>
    <td width="100%" valign="top" background="immagini/indexbg_r3_c3.png">&nbsp;</td>
    <td width="288" valign="top"><img src="immagini/indexbg_r3_c6.png" width="288" height="24"></td>
    <td width="22" valign="top"><img src="immagini/indexbg_r3_c9.png" width="22" height="24"></td>
  </tr>
</table>
</body>
</html>

grazie
EDIT lucasali: quando posti del codice ricordati di usare il tag code.

iacchi · « **Risposta #3 il:** 27 Gennaio 2005 18:39:33 »

Ecco come vedo la pagina con FF:

e come la vedo con IE:

Non ci vedo molte differenze...

felicelibero · « **Risposta #4 il:** 27 Gennaio 2005 18:55:38 »

ehm, hai provato ad aumentare la dimensione del carattere? E' quello il problema

Comunque ho dovuto nominare il mostro solo perche' le pagine le verifico con vari browser...ho lo stesso problema con Netscape (mi pare che prima non clo dava....)

klades · « **Risposta #5 il:** 27 Gennaio 2005 20:29:14 »

Citazione da: felicelibero

e' normale e sono io che non lo sapevo o cosa potrebbe essere?

Sicuramente è un problema legato a tutti quei td tr table uno dentro l'altro.
Infatti se provi questo semplicissimo codice

Codice: [Seleziona]


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.hosting {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 11px;
   padding-left: 20px;
   padding-top: 10px;
   background-image: url(immagini/pcbg.jpg);
   background-repeat: no-repeat;
}
</style>
<body>
<div>
<p class="hosting">PROVA A 11px</p>
</div>
</body>
</html>

puoi vedere che la dimensione dei caratteri viene mantenuta.
Buona ricerca!
Ciao, Paolo

felicelibero · « **Risposta #6 il:** 27 Gennaio 2005 20:40:19 »

e no scusa ciao Paolo, a me non tiene assolutamente ,

ho appena fatto la prova e il carattere si ingrandisce sempre di piu' ogni volta che clicco su Visualizza >dimensioni carattere> Aumenta...

stiamo parlando della stessa cosa, dai non fate scherzi, e' importante, ho tutti i miei lavori e quelli di altri con questo problema.....

klades · « **Risposta #7 il:** 27 Gennaio 2005 21:38:05 »

Citazione da: felicelibero

e no scusa ciao Paolo, a me non tiene assolutamente ,
ho appena fatto la prova e il carattere si ingrandisce sempre di piu' ogni volta che clicco su Visualizza >dimensioni carattere> Aumenta...

Hai ragione sorry!!!
Per farmi perdonare ti dò un bel link dove trovi trattata la questione
http://pro.html.it/print_articolo.asp/id_8/stampa.html
Nota in particolare che

Citazione

Opera (a partire dalla versione 4), Netscape 6 e Explorer 5 per Mac consentono di effettuare lo zoom sul testo, a prescindere dall'unità di misura adottata (pixel compresi). Incredibilmente Microsoft non ha introdotto questa funzione in Explorer 6, continuando ad usare le funzionalità delle versioni precedenti e la classica scala che va da Molto piccolo a Molto grande e che non ha effetto sui pixel.

Quindi in pratica solo su ie6 per win i font rimangono di dimensione "bloccata".
Ciao ancora!

felicelibero · « **Risposta #8 il:** 27 Gennaio 2005 22:04:35 »

Klades, ci sei? Aiuuut, aspietta nu momento.

Ho dato una letta......ma cosa vuole dire in pratica, non e' che ci ho capito molto
Non mi sembra neanche molto pertinente al problema....Da quanto ho capito la si parla di come fare per ingrandire i caratteri in maniera che visualizzati su diversi browser rispecchino tutti le stesse proporzioni ma io ho bisogno di bloccare quei dannati font ,che il diavolo se li porti che diamine !( questa l'ho rubata da un vecchio film)
( Anche perche' la questione dell'usabilta' dal punto di vista teorico mi sta bene ma ti assicuro che una pagine web rotta e' molto piu' illegibile di un testo piccolo,spec ie ase un testo nero sfora su un bg scuro o viceversa ma come salvo quello che ho fatto se mi sta bene cosi'? E poi FF non 'e' neanche menzionato.......

Se non si possono bloccare i font a che servono piu' i css, solo per mettere i fondi? Ma a me FF non mantiene neppure la dimensione delle celle (prova a ingrandire il mio codice oltre il 1280 e ti accorgi che due tabelle dalle dimensioni fissate si allargano e le immagini e i testi si spalmano anche coln il testo non zoomato ovvero normale.....

Cioe': non ci sto capendo piu' niente.....

damme na mano

felicelibero · « **Risposta #9 il:** 27 Gennaio 2005 22:16:34 »

Ops, mi era sfuggito questo nella fretta

> Quindi in pratica solo su ie6 per win i font rimangono di dimensione "bloccata".<

cioe':nun se po' proprio fa? Traduco: vuoi dire che ......non si possono piu' bloccare i font?

klades · « **Risposta #10 il:** 27 Gennaio 2005 22:18:44 »

Citazione da: felicelibero

Ho dato una letta......ma cosa vuole dire in pratica, non e' che ci ho capito molto
Non mi sembra neanche molto pertinente al problema....Da quanto ho capito la si parla di come fare per ingrandire i caratteri in maniera che visualizzati su diversi browser rispecchino tutti le stesse proporzioni ma io ho bisogno di bloccare quei dannati font ,che il diavolo se li porti che diamine !( questa l'ho rubata da un vecchio film)
( Anche perche' la questione dell'usabilta' dal punto di vista teorico mi sta bene ma ti assicuro che una pagine web rotta e' molto piu' illegibile di un testo piccolo,spec ie ase un testo nero sfora su un bg scuro o viceversa ma come salvo quello che ho fatto se mi sta bene cosi'? E poi FF non 'e' neanche menzionato.......

FF non è menzionato, ma ha lo stesso "motore" di Netscape e quindi lo stesso comportamento.
Cosa vuol dire?
Semplice: indicando la grandezza dei font in pixel nei fogli di stile, solo su Internet Explorer per Win risulteranno "bloccati", su tutti gli altri browser vengono ingranditi con tutto il resto se l'utente cambia i parametri di visualizzazione.
Non credo che tu possa "bloccare" i font. Il che mi pare anche giusto: tu proponimi un layout con i fogli di stile, poi decido io se va bene o no

E poi pensa a chi ha problemi di vista con i caratteri piccoli.

Citazione da: felicelibero

Se non si possono bloccare i font a che servono piu' i css, solo per mettere i fondi? Ma a me FF non mantiene neppure la dimensione delle celle (prova a ingrandire il mio codice oltre il 1280 e ti accorgi che due tabelle dalle dimensioni fissate si allargano e le immagini e i testi si spalmano anche coln il testo non zoomato ovvero normale.....
Cioe': non ci sto capendo piu' niente.....
damme na mano

Sulle celle non so cosa dirti, ma penso che il discorso di fondo sia lo stesso: il layout non lo puoi bloccare totalmente, quindi o ci passi sopra o cerchi di creare un qualcosa che sia fruibile anche se l'utente cambia dimensioni.
Non credo hai altra scelta (lasciando perdere java flash e compagnia).

felicelibero · « **Risposta #11 il:** 27 Gennaio 2005 22:36:51 »

capisco......cioe' .quello che mi hai spiegato tu si l'ho capito , percio' ti ringrazio.

Quello che non capisco sono gli altri invece, i geni che stanno dietro a tutto cio'.
E' ovvio che il problema e' affrontato nella maniera sbagliata, se l'usabilita' e' l'obiettivo questa soluzione fa ancora piu' casino rischiando di rendere un testo illegibile anche a chi ci vede.......cioe' risolve il problema al contrario.... non fare leggere niente a nessuno (in certi casi almeno e comunque ponendo dei limiti espressivi troppo restrittivi e costringendo la creativita' ad un esercizio rivolto al destreggiamento di tali limiti......brrr gelida sensazione.......)

Certo che nell'era in cui siamo e' perlomeno assurdo che nu compiuterr con le caratteristiche attuali, non sia in grado di fare quello che fa una comune lente d'ingrandimento di vetro...cioe' ingrandire tutto, figure e testo.....mah!
Comunque smetto se no vado O.T. Spero che la riflessione sia condivisibile.

grazie ancora e a risentirci alla prossima,
spero di non avere rotto troppo.

salutoni

shaitan · « **Risposta #12 il:** 27 Gennaio 2005 23:07:10 »

Citazione da: felicelibero

.cioe' ingrandire tutto, figure e testo.....
salutoni

ingrandire (o meglio rimpicciolire, se no per la risoluzione sono cavoli) immagini non è facile, ma butta un occhio qui http://www.constile.org/tips/immagini_proporzionali/ di certo l'articolo non risolve il tuo problema, ma può essere una lettura stimolante

edit: ancora meglio questo http://www.constile.org/template/pagine_zoomabili/