+ Rispondi alla Discussione
Risultati da 1 a 6 di 6

Discussione: centrare un div nella pagina

  1. #1
    Data Registrazione
    Nov 10
    Messaggi
    7

    Predefinito centrare un div nella pagina

    ciao

    ho realizzato questa pagina:ho allegato il file


    quello che non capisco è perchè quando vado a centrare il dv 1, gli altri dv posti all'interno non si centrano ma rimangono spostati a sinistra :?

    questo è il codice,non capisco dove sbaglio!

    <!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=utf-8" />
    <title>Documento senza titolo</title>
    <style type="text/css">
    <!--
    body {
    background-image: url(sfondo%20304%20stelle%20fissa.jpg);
    background-repeat: repeat;
    }
    #apDiv1 {
    position:absolute;
    left:71px;
    top:3px;
    width:1024px;
    height:769px;
    z-index:1;
    }
    #apDiv2 {
    position:absolute;
    left:108px;
    top:159px;
    width:115px;
    height:68px;
    z-index:2;
    }
    #apDiv3 {
    position:absolute;
    left:69px;
    top:222px;
    width:111px;
    height:78px;
    z-index:3;
    }
    #apDiv4 {
    position:absolute;
    left:37px;
    top:282px;
    width:109px;
    height:82px;
    z-index:4;
    }
    #apDiv5 {
    position:absolute;
    left:79px;
    top:386px;
    width:147px;
    height:94px;
    z-index:5;
    }
    #apDiv6 {
    position:absolute;
    left:101px;
    top:461px;
    width:127px;
    height:77px;
    z-index:6;
    }
    #apDiv7 {
    position:absolute;
    left:928px;
    top:202px;
    width:111px;
    height:74px;
    z-index:7;
    }
    #apDiv8 {
    position:absolute;
    left:950px;
    top:271px;
    width:109px;
    height:75px;
    z-index:8;
    }
    #apDiv9 {
    position:absolute;
    left:949px;
    top:336px;
    width:115px;
    height:79px;
    z-index:9;
    }
    #apDiv10 {
    position:absolute;
    left:963px;
    top:416px;
    width:119px;
    height:81px;
    z-index:10;
    }
    #apDiv11 {
    position:absolute;
    left:875px;
    top:437px;
    width:119px;
    height:85px;
    z-index:11;
    }
    -->
    </style></head>

    <body>
    <div id="apDiv1">
    <embed src="stargatemodificato.swf" width="720" height="576" hspace="200" vspace="30" loop="false"></embed>
    </div>
    <div id="apDiv2"><img src="cairo.png" width="110" height="59" /></div>
    <div id="apDiv3"><img src="cittafaraoni.png" width="140" height="75" /></div>
    <div id="apDiv4"><img src="edfu.png" width="200" height="107" /></div>
    <div id="apDiv5"><img src="egitto faraoni.png" width="140" height="75" /></div>
    <div id="apDiv6"><img src="luxor.png" width="110" height="59"/></div>
    <div id="apDiv7"><img src="mar rosso.png" width="110" height="59" /></div>
    <div id="apDiv8"><img src="memphis.png" width="110" height="59" /></div>
    <div id="apDiv9"><img src="nasser.png" width="140" height="75" /></div>
    <div id="apDiv10"><img src="nilo.png" width="110" height="59" /></div>
    <div id="apDiv11"><img src="mail.png" width="210" height="134" /></div>
    </body>
    </html>

    grazie!
    Immagini Allegate

  2. #2

    Predefinito

    se con il css centri il div esterno, non è detto che gli altri siano centrati.
    ad esempio:
    Codice:
            <div id="main">
                <div id="pages">
                   bla bla bla
                </div>
            </div>
    questo è il css:
    Codice:
    #main {
        width: 800px;
        min-height: 800px;
        margin-top: 40px;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: auto;
        border: 1px solid white;
    }
    
    #pages {
        width: 700px;
        height: 650px;
        margin-top: 20px;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: auto;
    /*    border: 1px solid white;*/
    }
    main è centrato rispetto a body, e pages è centrato rispetto a main.

  3. #3
    Data Registrazione
    Nov 10
    Messaggi
    7

    Predefinito

    hemm...pensavo si centrasse tutto assieme
    allora devo inserire in div....centrarlo e poi succesivamente inserire
    al suo interno gli altri div,giusto?

  4. #4

    Predefinito

    in sostanza si.
    diciamo che ogni elemento lo devi posizionare rispetto all'elemento padre.
    poi dipende anche da che tipo di posizionamento usi, però diciamo che vale come discorso generale.

  5. #5
    Data Registrazione
    Nov 10
    Messaggi
    7

    Predefinito

    il posizionamento sarà centrato in modo che aprendo la pagina il layout della stessa
    sia visualizzata centrata, spero in quasi tutte le risoluzione di gran parte di monitor e browser.
    provo e poi ti faccio sapere se tutto ha funzionato a dovere
    grazie!

  6. #6
    Data Registrazione
    Nov 10
    Messaggi
    7

    Predefinito

    benissimo, adesso è tutto centrato
    però ho notato che alla risoluzione 1024 del monitor
    i pulsanti che ho inserito affianco al file flash non si vedono
    perchè la pagina risulta tagliata (alla risoluzione 1440 è tutto ok)

    si possono inserire i pulsanti sopra al file flash? renderlo trasparente?
    perchè ho provato e ho visto che il flash li nasconde dietro ad esso,così facendo
    stringo il layout e si dovrebbe visualizzare bene anche alla risoluzione 1024

    grazie!

+ Rispondi alla Discussione

Discussioni Simili

  1. centrare una pagina web
    Di cristyne nel forum Programmazione
    Risposte: 2
    Ultimo Messaggio: 30-11-10, 19:03
  2. [iPhone 3G/3GS] iTunes non lo mostra nella pagina principale
    Di Rico nel forum iPhone - iPad - Apple in mobilità
    Risposte: 1
    Ultimo Messaggio: 08-06-10, 11:12
  3. Includere una pagina PHP in una pagina HTML
    Di Thunder nel forum Programmazione
    Risposte: 2
    Ultimo Messaggio: 28-02-10, 13:57
  4. Redirect di una pagina
    Di fermat nel forum Programmazione
    Risposte: 1
    Ultimo Messaggio: 17-12-09, 14:54

Segnalibri

Permessi di Scrittura

  • Tu non puoi inviare nuove discussioni
  • Tu non puoi inviare risposte
  • Tu non puoi inviare allegati
  • Tu non puoi modificare i tuoi messaggi
  • Il codice BB è Attivato
  • Le faccine sono Attivato
  • Il codice [IMG] è Attivato
  • Il codice HTML è Disattivato