• S
    User Attivo •

    spaziatura tra 2 div

    ciao a tutti
    sto cercando di organizzare i contenuti di questa pagina

    http://www.pennacchiaeassociati.it/test/attivita.html

    ma non riesco a ridurre lo spazio verticale che si crea in FF2 tra il div "titolo_sezione" e il div "boxer" che si trova subito sotto.....

    in dreamweaver vedo tutto bello serrato, cioe' subito sotto il primo div inizia quello successivo...poi nel browser le cose cambiano...

    in IE7 e' un po' meglio ma rimane comunque uno spazio eccessivo sotto il div "titolo_sezione"

    dove sbaglio?:?
    ne ho provato 1000 di soluzioni ma nessuna mi risolve il probl.....:(

    thnxxx!

    0
  • L
    User Attivo •

    Ciao sustek,
    controlla di avere impostato i margini dei div. Se non sono impostati mettili a 0, di solito è buona abitudine azzerare dall'inizio tutti gli elementi con
    html, bofy {margin:0px }
    perchè capita che se non vengono definiti, i browser mettano valori di default (ovviamente a piacere).

    Se non risolvi, a volte capita con le liste, controlla che nell'html non ci siano spazi tra la fine di un div e l'inizio di un altro: <div>..</div><div>...</div>

    Altro non mi viene in mente 😉

    0
  • S
    User Attivo •

    alla fine ho risolto con il margine
    pero' fino a quando lo assegnavo al div nn funzionava....
    poi l'ho assegnato all'h2 dentro al div .....
    e puff
    tutt'apposto 🙂
    grazie cmq...

    p.s......senza che apro un'altro thread.....
    sai di solito per cosa si usa il div "wrapper"

    0
  • L
    User Attivo •

    @sustek said:

    p.s......senza che apro un'altro thread.....
    sai di solito per cosa si usa il div "wrapper"

    Serve da conenitore per tutti i div che formano la struttura di un layout. E' prassi usarlo perchè principalmente ti permette di gestire la dimensione del layout agendo solo sui suoi parametri.

    Ad esempio se tu volessi un layout fixed di larghezza 760px, invece di mettere ai div header, content e footer l'appropriato width, lo imposti solo per il wrapper che li contiene (e lasci loro a 100%). Così se il giorno dopo vuoi trasformare il tuo layout in liquido, o aumentarne le dimensioni, cambi solo il width del wrapper.

    Questa è l'applicazione principale, usare un wrapper è molto utile anche per altre cose.

    :ciauz:

    0
  • S
    User Attivo •

    chiaro!!!
    quindi wrapper puo' essere considerato sinonimo di container?
    e se cosi' fosse.....
    una struttura tipo potrebbe essere fatta cosi?:

    <wrapper>

    <header></header>
    <content>
    <sx></sx>
    <centro></centro>
    <dx></dx>
    </content>

    <footer></footer>

    </wrapper>

    Thnxx Laburno!
    😉

    p.s. ti viene in mente qlche altro esempio di uso del wrapper?

    0
  • R
    User Newbie •

    Ciao.

    Ho visto la vostra discussione e mi ha interessato.

    Posso avere un breve listato di css esterno riferito al tuo esempio sul wrappen per farmi un'idea di come realizzarlo ?

    Ciao.

    0
  • S
    User Attivo •

    ciao!!
    questo e' il css :

    body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, center, dir, hr, menu, pre {

    display:block;

}

    html, body {

    font-size:76%;

margin: 0 auto;

padding: 0;

background-color: #909090;

position:relative;

}

    li

    {

    height:100%;

display: list-item;

float: Left;

font-family: "Times New Roman", Times, serif;

font-size: 1.4em;

font-style: normal;

padding-top: 2em;

list-style-type: none;

    }

    ul

    {

    display: inline;

    }

    #wrapper {

    width:770px;

margin:0 auto;

padding:0;

position:relative;

}

    #header {

    background-image: url(../immagini/penn_index_uk_testata.jpg);

background-position: center top;

background-color:;

height: 95px;

width: 100%;

margin:25px 0 0 0;

padding:0;

border-width:0px;

background-repeat: no-repeat;

}

    #content {

    border-width:0px;

padding:0;

margin:0 auto;

width: 100%;

background-color: #FFFFFF;

}


    font-family: Arial, Helvetica, sans-serif;

font-size: 1.8em;

color: #333333;

margin: 0 auto;

padding: 1em 1.2em 3em 1.2em;

text-align: justify;

font-weight: normal;

    }

    #titolo_sezione {

    padding: 1em 1.5em 1em 1.5em;

margin:0 auto;

border-width:0px;

position:relative;

border-style: none;

    }

    display: inline;

font-size: 3em;

color: #000033;

font-family: "Times New Roman", Times, serif;

font-style:normal;

font-weight:bold;

font-variant:normal;

    }

    #boxer_attivita{

    float: left;

width: 100%;

border: 0;

margin: 0 auto;

background-image: url(../immagini/riquadro_stondo_attivita.png);

background-repeat: no-repeat;

background-position: center 62px;

background-color:#FFFFFF;

    }

    font-family: Arial, Helvetica, sans-serif;

font-size: 1.6em;

color:;

margin: 0 1em 0 1em;

    }

    font-family:Arial, Helvetica, sans-serif;

font-size:1.4em;

white-space: nowrap;

width: 100%;

margin: 0 1em 0 0.5em;

float: left;

padding: 0;

list-style-position: inside;

list-style-type: disc;

display: list-item;

list-style-image: url(img/tondo_lista.png);

}

    #boxer_giurisprudenza{

    float: left;

width: 100%;

border: 0;

margin: 0 auto;

background-color:#FFFFFF;

padding: 0 0 4em 0;

    }

    font-family: Arial, Helvetica, sans-serif;

font-size: 1.4em;

color:;

margin: 0.2em 1em 0.2em 1em;

font-style: normal;

font-weight: normal;

    }

    font-family:Verdana, Arial, Helvetica, sans-serif;

font-size:1.5em;

white-space: nowrap;

width: 100%;

margin: 0 auto;

float: left;

padding: 0 0 0 3em;

list-style-position: inside;

list-style-type: disc;

display: list-item;

}


    padding-left: 1em;

margin-left: 0;

    }

    font-size: 2em;

padding: 0 1em 0 1em;

font-style: normal;

font-family: Arial, Helvetica, sans-serif;

margin: 0 auto;

    }

    font-family: Arial, Helvetica, sans-serif;

font-size: 1.4em;

color:;

margin: 0.2em 1em 0.2em 3.2em;

font-style: normal;

font-weight: normal;

    }

    #boxer_modulistica {

    float: left;

width: 100%;

margin: 0 auto;

padding: 0;

background-color:;

    }

    font-family: Arial, Helvetica, sans-serif;

font-size: 1.6em;

color:;

margin: 0 auto;

padding: 0 1em;

    }

    #box_top {

    text-align: justify;

padding: 0 0 0.5em 0;

margin: 0 auto;

width: 100%;

    }

    display: inline;

    }

    #box_sx{

    float: left;

margin: 0.2em 0 2em 0.5em;

padding: 0;

width: 310px;

}


    color: #000000;

    }

    #box_dx {

    float: left;

margin: 0.2em 1.2em 1em 0.8em;

padding: 0;

width: 340px;

}

    #box_dx_giurisprudenza {

    float: left;

margin: 0.2em 1.2em 1em 0.8em;

padding: 0;

width: 300px;

    }

    #box_modulistica{

    float: left;

margin: 0 auto;

padding: 0.2em 0 2em 2.5em;

width: 500px;

}


    font-family: Arial, Helvetica, sans-serif;

font-size: 1.6em;

white-space: nowrap;

margin: 0 0 0 1.5em;

float: left;

padding: 0;

width: 100%;

list-style-position: outside;

list-style: circle;

display: list-item;

    }

    #pulsantiera {

    float: left;

background-color:;

width: 100%;

white-space: nowrap;

height: 7em;

position: relative;

margin: 0 auto;

}

    #pulsantiera_giurisprudenza {

    float: left;

background-color:;

width: 100%;

white-space: nowrap;

margin: 0 auto;

padding:0;

display:inline;

    }

    height:3em;    

float: left;

white-space: nowrap;

margin: 0 auto;

padding-top: 2em;

display: list-item;

list-style-type:none;

font-style:normal;

    }

    /* Classi */

    .center{

        text-align:center;

}

    .pennacchia {

    color:;

font-family: Georgia, "Times New Roman", Times, serif;

font-style: normal;

font-weight: normal;

}

    .adusbef {

        color:;

    font-size: 100%;

    font-family: Arial, Helvetica, sans-serif;

}

    /* Classi PULSANTI */

    .puls_dicono {

    width: 145px;

margin: 0 auto;

    }

    .puls_attivita {

    width: 83px;

margin: 0 auto;

    }

    .puls_giurisprudenza {

    width: 148px;

margin: 0 auto;

    }

    .puls_pareri {

    width: 120px;

margin: 0 auto;

    }

    .puls_home {

    width: 100px;

margin: 0 auto;

    }

    .puls_profilo {

    width: 60px;

margin: 0 auto;

    }

    .puls_contatti {

    width: 83px;

margin: 0 auto;

    }

    .puls_profilo_home {

    width: 120px;

margin: 0 auto;

    }

    .puls_dicono_home {

    width: 125px;

margin: 0 auto;

    }

    .puls_attivita_home {

    width: 120px;

margin: 0 auto;

    }

    .puls_giurisprudenza_home {

    width: 120px;

margin: 0 auto;

    }

    .puls_pareri_home {

    width: 160px;

margin: 0 auto;

    }

    .puls_contatti_home {

    width: 100px;

margin: 0 auto;

    }

    /* LINKS */

    a:link {

        text-decoration: none;

    color: #EEEEEE;

}

    a:visited {

        text-decoration: none;

    color:;

}

    a:hover {

        text-decoration: none;

    color: #DAA520;

}

    a:active {

        text-decoration: none;

    color:;

}

    a.external:link {

    font:Arial, Helvetica, sans-serif;

text-decoration: none;

color:;

}

    a.external:visited {

    font:Arial, Helvetica, sans-serif, 1em;

text-decoration: none;

color:;

}

    a.external:hover {

    font:Arial, Helvetica, sans-serif, 1em;

text-decoration: none;

color:;

}

    a.external:active {

    font:Arial, Helvetica, sans-serif, 1em;

text-decoration: none;

color:;

}

    Spero possa esserti utile! 😉
    Attenzione!!
    non prenderlo per oro colato!!!

    0
  • R
    User Newbie •

    Salve. E grazie. Ma ho avuto dei problemi con la "backgroud-image".

    Voglio che lo sfondo dell'intero schermo sia unico e sia una immagine.

    Con un programma di grafica avevo creato un'immagine che poi avevo trasferito direttamente come sfondo di fp2000. In automatico questa veniva ripetuta ma con il foglio di css questo non avviene. Vorrei sapere se il modo per richiamare l'immagine è corretto :

    body { background-image: url ("images/ph_bgr_00.gif");
    background-repeat: repeat;
    }

    0
  • L
    User Attivo •

    @ribeneweb said:

    Salve. E grazie. Ma ho avuto dei problemi con la "backgroud-image".

    Voglio che lo sfondo dell'intero schermo sia unico e sia una immagine.

    Con un programma di grafica avevo creato un'immagine che poi avevo trasferito direttamente come sfondo di fp2000. In automatico questa veniva ripetuta ma con il foglio di css questo non avviene. Vorrei sapere se il modo per richiamare l'immagine è corretto :

    body { background-image: url ("images/ph_bgr_00.gif");
    background-repeat: repeat;
    }

    Il codice è corretto. Controlla che il path dell'immagine sia giusto.

    0
Effettua l'accesso per rispondere