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

    Allineamento dentro un Div

    Ho il div "a" che contiene altri 3 div.

    <div id="a">
    <div id="a1">alto</div>
    <div id="a2">centro</div>
    <div id="a3">basso</div>
    </div>

    Ho bisogno che, assegnata un'altezza fissa ad "a", "a1" si posizioni allineato in alto, "a2" si posizioni all'incirca al centro e "a3" si posizioni allineato in basso.
    Come potrei scrivere il foglio di stile?
    Ad esempio ho fatto questa prova ma il div "a3" proprio non si vuole muovere!! Se uso position:absolute si posiziona in base "al body" quindi uso position:relative.
    Che dite? Suggerimenti?

    #a { float: left;
    background-color: #FF9933;
    width: 145px;
    height: 500px; }

    #a3 { border: 1px solid red;
    position: relative;
    display: block;
    bottom: 0px;
    text-align:center; }


    Grazie per l'aiuto
    Ciao

  2. #2
    Moderatore di Off Topic, Kickstarter e XML L'avatar di Sky
    Registrato dal
    Jul 2000
    residenza
    Roma
    Messaggi
    1,053
    position: absolute si riferisce al <div> contenitore, ma se esso non è posizionato sempre con questa proprietà, l'absolute fa riferimento al primo "contenitore" che soddisfi tale condizione (il <body> nel tuo caso).

    Quindi puoi dare un semplice "position: relative" al <div> "a" (che non dovrebbe modificarne la posizione) e "poi position: absolute" al <div> "a3", con la proprietà "bottom" impostata a 0px ovviamente.

    Ciao ciao :)
    Lo Stato deve dare ai cittadini, come diritto, ciò che la mafia dà come favore.
    Carlo Alberto dalla Chiesa

    Facebook | Twitter | Last.fm | LinkedIn | Quora

  3. #3
    "position: relative" al <div> "a" (che non dovrebbe modificarne la posizione) e "poi position: absolute" al <div> "a3", con la proprietà "bottom" impostata a 0px ovviamente.
    Effettivamente... pare tutto ok...

    Grazie

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 © 2026 vBulletin Solutions, Inc. All rights reserved.