• A
    User Newbie •

    Il sito si vede sfasato sui vari broswer

    Ciao ragazzi, sto costruendo il mio sito web con dreamweaver, non riesco a capire perche una volta pubblicato si vede tutto sfasato, ossia le tabelle varie tutte fuori asse idem per foto ecc. Come posso fare a risolvere questo enigma?
    Grazie anticipatamente.
    Andrea

    0
  • dario.scarano
    Moderatore •

    Ciao Andreasnake e benvenuto nel Forum GT!

    Ti sposto nella sezione più adatta.

    0
  • M
    User Attivo •

    sfasato in che senso?
    ma solo su IE o dici tra IE e FF?
    hai classi (css)?

    0
  • A
    User Newbie •

    Praticamente vedo le tabelle sfasate in Explorer, Mozilla, Opera, sono su safari vedo bene.. Come devo fare? Il sito lo sto facendo con tabelle e layout.
    Potreste aiutarmi è un gran dilemma che mi blocca. Ci sto lavorando ad una risuoluzione di i1024 x 768.
    Grazie.

    0
  • M
    User Attivo •

    1024..quindi sono larghe sui 1000 circa o usi 100%?
    bordi, margini ecc?

    0
  • A
    User Newbie •

    ma ci lavoro sul 100%.
    Niente bordi faccio tutto con tabelle, credi che dovrei inserire bordi?
    Se si dammi una mano anche su come metterli con dream.
    Grazie mille per l'interessamento.

    0
  • K
    Super User •

    Ciao andreasnake

    prova a postare uno screennshoot della pagina in modo che possiamo capire come lo vedi

    eventualmente anche il codice potrebbe essere utile, cosi e un po difficile capire dove sia il problema.
    🙂

    0
  • A
    User Newbie •

    Eccne uno!
    Anche se non è quello attuale ma il problema è questo.. In quello attuale le tabelle che sono all'interno di un altra tabella una volta inserita nel browser si sfasano tutte, ossia vanno a mettersi fuori dalla tabella principale...
    Ecco il codice:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ".org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns=".org/1999/xhtml">
    <!-- DW6 -->
    <head>
    <!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->
    <title>Spettacolo - Home page</title>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <link rel="stylesheet" href="file:///Macintosh HD/Users/Andrea/Desktop/mm_entertainment.css" type="text/css" />
    <style type="text/css">
    <!--
    body,td,th {
    color: #000000;
    }
    body {
    background-color: #E67300;
    }
    #Layer1 {
    position:absolute;
    width:908px;
    height:368px;
    z-index:1;
    left: 14px;
    top: 56px;
    }
    #Layer2 {
    position:absolute;
    width:800px;
    height:340px;
    z-index:1;
    top: 60px;
    left: 85px;
    }
    .Stile2 {
    font-size: 36px;
    font-family: "Comic Sans MS";
    }
    .Stile3 {font-size: 24px}
    #Layer3 {
    position:absolute;
    width:182px;
    height:157px;
    z-index:1;
    top: 20px;
    }
    .Stile4 {
    color: #FFFFFF;
    font-size: 18px;
    font-family: "Comic Sans MS";
    }
    #Layer4 {
    position:absolute;
    width:200px;
    height:37px;
    z-index:1;
    left: 529px;
    top: 16px;
    }
    .Stile5 {font-size: 14px}
    #Layer5 {
    position:absolute;
    width:562px;
    height:353px;
    z-index:2;
    left: 167px;
    top: 234px;
    }
    #Layer6 {
    position:absolute;
    width:504px;
    height:306px;
    z-index:2;
    left: 311px;
    top: 298px;
    }
    #Layer7 {
    position:absolute;
    width:183px;
    height:356px;
    z-index:3;
    left: 859px;
    top: 285px;
    }
    #Layer8 {
    position:absolute;
    width:188px;
    height:355px;
    z-index:4;
    left: 74px;
    top: 286px;
    }
    #Layer9 {
    position:absolute;
    width:200px;
    height:36px;
    z-index:5;
    left: 6px;
    top: 37px;
    }
    .Stile6 {
    font-family: "Comic Sans MS";
    font-size: 16px;
    color:;
    }
    #Layer10 {
    position:absolute;
    width:200px;
    height:34px;
    z-index:5;
    left: 7px;
    top: 63px;
    }
    #Layer11 {
    position:absolute;
    width:200px;
    height:33px;
    z-index:5;
    left: 8px;
    top: 88px;
    }
    #Layer12 {
    position:absolute;
    width:177px;
    height:106px;
    z-index:5;
    left: 2px;
    top: 24px;
    }
    #Layer13 {
    position:absolute;
    width:200px;
    height:115px;
    z-index:1;
    left: -6px;
    top: 25px;
    }
    #Layer14 {
    position:absolute;
    width:200px;
    height:115px;
    z-index:5;
    left: 2px;
    top: 22px;
    }
    #Layer15 {
    position:absolute;
    width:200px;
    height:115px;
    z-index:1;
    left: 746px;
    top: 306px;
    }
    -->
    </style></head>
    <body>
    <div align="center">
    <table width="1029" height="164" border="1" bgcolor="#666666">
    <tr>
    <td width="714"><div align="center" class="Stile2">
    <p align="left"><strong>Welcome to Constrictormorphs </strong></p>
    <div class="Stile5" id="Layer4">
    <p>21-01-2008 22:16</p>
    </div>
    <p align="left"><span class="Stile3"><u>Allevamento amatoriale specializzato in boa constrictor </u></span></p>
    </div></td>
    <td width="240"><img src="logo nuovo.gif" alt="Logo Cm" width="182" height="157" /></td>
    </tr>
    </table>
    <table width="1030" height="818" border="5" bgcolor="#000000">
    <tr>
    <td width="953" height="42"><table width="893" height="35" border="1">
    <tr>
    <td><div align="center"><span class="Stile4">Home</span></div></td>
    <td><div align="center" class="Stile4">Chi siamo </div></td>
    <td><div align="center" class="Stile4">Galleria</div></td>
    <td><div align="center" class="Stile4">Disponibilità</div></td>
    <td><div align="center" class="Stile4">Contatti</div></td>
    </tr>
    </table></td>
    </tr>
    <tr>
    <td height="760" bordercolor="#333333"><div id="Layer6">
    <table width="505" height="346" border="1">
    <tr>
    <td><img src="DSCF0427.jpg" alt="Sunglow" width="505" height="346" /></td>
    </tr>
    </table>
    </div>
    <div id="Layer7">
    <table width="200" border="1">
    <tr>
    <td height="26"><div align="center" class="Stile4">Blog</div></td>
    </tr>
    <tr>
    <td height="325"> </td>
    </tr>
    </table>
    </div>
    <div id="Layer8">
    <table width="200" height="353" border="1">
    <tr>
    <td height="22" class="Stile4"><div align="center">Collezione</div></td>
    </tr>
    <tr>
    <td height="316"><div id="Layer9">
    <div align="center"><span class="Stile6"><u>Ancestrale</u></span></div>
    </div>
    <div class="Stile6" id="Layer10">
    <div align="center"><u>Albino Kahl </u></div>
    </div>
    <div class="Stile6" id="Layer11">
    <div align="center"><u>Albino Sharp</u>
    <div id="Layer12"><u>Anery</u>
    <div id="Layer13"><u>Ghost</u>
    <div id="Layer14"><u>Salmon</u></div>
    </div>
    </div>
    </div>
    </div></td>
    </tr>
    </table>
    <p> </p>
    </div></td>
    </tr>
    </table>
    </div>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    </body>
    </html>

    0
  • K
    Super User •

    cosi da una lettura veloce direi che il problema e nell'absolute, in pratica se lo imposti absolute il div si posiziona ,appunto in modo assoluto, quindi naturale che
    si sfasi tutto o che si sovrappongono con altri div.

    Comunque ora vado a mangiare dopo lo guardo meglio e cerchiamo di trovare una soluzione.

    🙂

    0
  • A
    User Newbie •

    Ecco grazie mille, perche mi blocco non posso andare avanti..
    Grazie ancora

    0
  • M
    User Attivo •

    il regno dell'absolute...
    ma scusa come mai mischi tabelle e layout?

    a parte questo stai annidando il mondo, div con dentro table o viceversa nn ha senso...
    ma solo con i div? se proprio tab...

    alla fine è la parte centrale che rimane fissa e nn segue..credo che la colpa sia tra #Layer8 e soci...

    0
  • K
    Super User •

    Ciao, scusa il ritardo sono rientrato da poco.

    beh direi che c'è un bel po di confusione con i div,quando si imposta la proprietà absolute a un div le dimensioni e la posizione sono indipendenti dagli altri, ecco il perchè dello sfasamento.

    ti faccio un esempio, se un div lo imposti con margin-left, cioe lo spazio tra il lato di sinistra e il div , a 100px e posizione assoluta e un altro div dai le stesse impostazioni naturale che si sovrappongono.

    Potra sembrarti banale ma la priam cosa che mi sento di consigliarti e di dare un occhiata ai fogli di stile e al loro utilizzo di seguito due ottime guide.

    [url=http://css.html.it/guide/leggi/2/guida-css-di-base/]guida di base ai css
    [url=http://www.giorgiotave.it/forum/css/54753-layout-izzatore.html]layout fluidi
    Da quello che vedo nel codice e da come conosco dreamweaver probabilmente hai disegnato i div " a mano" cioe usando lo strumento disegna livello, beh telo sconsiglio vivamente.il codice cosi come e un po difficile correggerlo, se hai freta di fare il sito, lascia stare per ora i div, quindi cancella il codice dei vari layer e usa solo tabelle, se invece hai voglia di imparare magari partendo proprio da questo sito che stai facendo allora:

    cancella tutto il codice e aiutandoti con le guide prova a creare uan struttra di base con i div, poi a suo interno puoi inserire quello che vuoi.
    purtroppo e una soluzione drastica ma cosi come e quasi impossibile correggere il codice.
    Parti creando 5 div,contenitore(che contiene gli altri div) header,menu,content,footer.
    imposta per ognuno le proprieta di base,il div principale contenitore, impostalo con misure in percentuale, oppure non impostare nulla se vuoi che occupi tutta la pagina.
    Pe rlevarie prorpieta dei div puoi usare il pannello dei stili di dreamweaver, crei un nuovo foglio di stile, lo coleghi al tuo file html, non usare percorsi assoluti come in questo codice che hai postato :
    <link rel="stylesheet" href="file:///Macintosh HD/Users/Andrea/Desktop/mm_entertainment.css" type="text/css" />
    e sbagliato:
    <link rel="stylesheet" href="stili/mm_entertainment.css" type="text/css" />
    e corretto, ho messo stili/ davanti presupponendo che ti crei una cartella apposita in cui conservare i fogli di stile.
    cancella tutti gli stili interni cioe :
    #Layer1 {
    position:absolute;
    width:908px;
    height:368px;
    z-index:1;
    left: 14px;
    top: 56px;
    }
    et company, che sono quelli che ti creano errore, ma per come e impostato sono anche la struttura portante del sito, se crei i 5 div come ti ho suggerito( ma non devono essere per forza 5,dipende da come struturi il tuo sito) ti semplifichi di gran lunga la vita e tutto il codice css
    lo inserisci nel foglio di stile collegato, cosi in ogni pagina ti basterà creare i div con i loro nomi e si riadatteranno automaticamente,

    SO che il tutto ti potra sembrare "profano" o strano, pero credimi, anche per me era cosi, ma con un po di impegno e di studio vedrai che otterrai ottimi risultati.
    In ogni caso noi siamo qua quando hai un problema posta.
    Se invece non ti va di studiare o perder tempo, allora cancella tutti i div,nel tuo codice e usa solo tabelle, ma se impari a usare i div avrai tantissime soddisfazioni, ci sono passato e lo so.

    🙂

    0
  • A
    User Newbie •

    Grazie mille, ho tantissima voglia di imparare solo che fino ad ora nessuno mi ha aiutato piu di tanto..
    Ho creato tutto a mano ( in progettazione) il codice lo sconosco non capisco neppure ciò che mi hai detto esempio: div,tag, e quant'altro..
    Se qualcuno mi illumina ci provo..
    Grazie mille.

    0
Effettua l'accesso per rispondere