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

    Layout 3C: perchè non funziona con FF ??

    Salve ragazzi !

    Mi rivolgo a voi esperti per capire dove posso correggere questo layout con 3 colonne in CSS che funziona su IE6.0 SP1 ma non con FF 1.0.3

    Ecco il link http://www.bisceglieweb.it/bari/prova_css/prova.htm

    Potete dargli uno sguardo ?

    Vi ringranzio anticipatamente

  2. #2
    Utente di HTML.it L'avatar di floyd46
    Registrato dal
    Feb 2002
    residenza
    Apulia
    Messaggi
    2,641

    Re: Layout 3C: perchè non funziona con FF ??

    ciao
    effettivamente su FF 1.3 è tutto sballato;
    dire che va bene su IE 6.0 è dire nulla in quanto per Intermerd Exploder, qualsiasi cosa gli dai da "mangiare", va tutto bene (manco per niente!). Secondo me è da rivedere tutto il CSS, adattandolo x i browser standard e poi, in ultimo, ottimizzarlo per IE.
    Saluti
    Floyd
    P.S. Ho letto bene? sei di Bisceglie? Leggi un pò la mia città, sotto l'avatar. Ciao paisà!!
    "Le persone che realizzano layout con tabelle annidate, spacer gif o che ignorano l'accessibilità non possono più definirsi professionisti." Andy Clarke
    --------------------------------

    www.extrowebsite.com

  3. #3
    Ciao Floyd, il miniportale che ho realizzato per puro divertimento e passione si poggia su hosting di Bisceglie ma io sono di Bari. Comunque siamo sempre vicini

    Potresti darmi maggiori dettagli o uno spunto da cui partire per capire come posso risolvere il problema ?

    Grazie

  4. #4
    Utente di HTML.it L'avatar di floyd46
    Registrato dal
    Feb 2002
    residenza
    Apulia
    Messaggi
    2,641
    ciao pcf!
    probabilmente abbiamo lo stesso hosting (se mi dici che è di Bisceglie).

    La prima cosa alla quale ho pensato, appena ho visto la pagina, è stata questa: hai per caso dato margini o padding alle colonne che compongono il layout? se hai fatto così, dovresti tenere conto del
    problema del box-model [margini, bordi e padding si sommano alla misura che stabilisci per la larghezza. Sia per il lato sx che dx]. Dovresti applicare la regola di tantek (www.tantek.com).
    fammi sapere
    "Le persone che realizzano layout con tabelle annidate, spacer gif o che ignorano l'accessibilità non possono più definirsi professionisti." Andy Clarke
    --------------------------------

    www.extrowebsite.com

  5. #5
    Mi sembra che IE aggiunga della misura in +, ma se va bene con IE dovrebbe andare meglio con FF.

    Se ti riferisci al box model
    http://www.tantek.com/CSS/Examples/boxmodelhack.html
    non ho ben compreso a quale regola tu riferisca e come applicarla

  6. #6
    Utente di HTML.it L'avatar di floyd46
    Registrato dal
    Feb 2002
    residenza
    Apulia
    Messaggi
    2,641
    allora... IE non aggiunge misura in +;
    lo fanno i browser standard (compreso IE 6); quelli precedenti no.
    Se una pagina la visualizzi bene con FF, Opera, Mozilla ecc...
    sicuramente in IE dovresti apportare qualche modifica.

    La regola del box model è proprio quella di cui hai postato la pagina dal sito di tantek: lì fa un esempio con un #div al quale viene assegnato un bordo di 20px (se nn ricordo male), oltre al padding.
    che cosa vuol dire questo: facciamo l'esempio che tu hai un box di 200px; vuoi dare un margin di 10px (attorno ad esso); un bordo di 10px.
    La misura corretta dovrebbe essere: 10px + 10px + 200px + 10px + 10px. Totale = 240px.
    Le versioni antecedenti ad IE 6, invece, ti danno un box della misura totale pari a 160px. Invece di aggiungere margini, bordi e padding (quando c'è), lo sottraggono dalla misura principale, cioè il contenuto. Come si applica la regola di tantek:
    Devi dare prima una misura "falsa", vale a dire quella totale; nel nostro caso 240px;
    poi devi aggiungere questo codice:
    voice-family: "\"}\"";
    voice-family:inherit;
    e poi la misura corretta: 200px.
    In pratica il CSS sarà:
    #box{
    margin:20px;
    padding:0;
    border:10px solid #f60;
    width:240px;
    voice-family: "\"}\"";
    voice-family:inherit;
    width:200px;
    }
    html>#box{ /* vale solo x Opera*/
    width:200px;
    }

    adesso devi applicare questa regola ai box del tuo sito;
    non conosco come hai realizzato la struttura, quindi....
    dovresti vedere se devi aggiungere questa regola.
    Ovviamente se al box dell'esempio avessi dichiarato un padding, avrei dovuto sommare anche la misura del padding stesso per dichiarare la misura "falsa".
    Spero di essere stato un pò kiaro.
    Fammi sapere.
    Saluti
    Floyd
    "Le persone che realizzano layout con tabelle annidate, spacer gif o che ignorano l'accessibilità non possono più definirsi professionisti." Andy Clarke
    --------------------------------

    www.extrowebsite.com

  7. #7
    Grazie sei stato molto gentile.

    Non appena verificherò quanto mi hai detto, ti avviso.

  8. #8
    Sto escludendo IE 5.0 e IE 5.5, infatti, questa estate uscirà persino IE 7.0, quindi ormai la 6.0 è sulla maggior parte dei PC.

    Sto rifacendo tutto dal principio, verificando per ogni inserimento di box, colonna, ecc, come si comporta IE6.0 e FF1.0.4 e modificando di conseguenza i parametri. (ad esempio i margin hanno effetti diversi )

    Per il resto dei browser Opera, Safari, ecc non tengo conto..

    E' un lavoraccio, ma spero darà i suoi frutti

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.