posizionare immagine in basso ad un div

[Sonea]

Ciao a tutti... avrei bisogno di posizionare un'immagine sul fondo di un div.
Il div in questione non ha altezza fissa, ho solo impostato un min-height e si trova all'interno di un altro div con float: left.

Come posso fare?

Grazie dell'aiuto!

[jubstuff]

L'immagine ha un contenuto informativo oppure è semplicemente estetica? In quest'ultimo caso, ti consiglio di metterla come background del div in questione tramite CSS, nel primo caso basta che nell'html l'immagine è posta come ultima.

[Sonea]

E' un immagine che funge da pulsante ma posso sempre mettere poi un bottone trasparente sopra.
Non ci avevo pensato.

[Sonea]

mmm... mettendola come background l'immagine va dove deve andare ma, essendo il div in questione, vuoto non riesco a fare il pulsante trasparente anche perchè ovviamente cambierebbero le coordinate a seconda della pagina...

[jubstuff]

Allora prova a fare così: crei un anchor con il testo, ci applichi del padding tutto intorno e poi ci metti come background l'immagine del pulsante. Così non dovresti avere problemi

[Sonea]

Ehm... Non ho ben capito...
tu intendi: mettere un anchor vuoto all'interno del div e dare a questo anchor l'immagine di sfondo?
Anche facendo così... come risolverei il fatto che l'immagine deve stare in basso?
Forse non ho capito bene...

[jubstuff]

Credo sia meglio che mostri come hai strutturato l'html. Altrimenti non riesco a capire

[Sonea]

Allora... ho un div contenitore strutturato così:

#box {width: 800px; margin: 0; padding: 0; background-color: #FFFFFF; overflow: hidden }

Poi ho un div #left

#left {width: 184px; float: left; border-right: 1px dotted #003778; }

e all'interno di questo div, ho il div in cui devo posizionare l'immagine sul fondo, strutturato così:

#contatti {width: 184px; background-color: #E8E2D2; border-top: 1px solid #0037778; min-height: 189px; background-image: url(img/contattaci.png); background-position: left bottom; background-repeat: no-repeat;}

Al momento, ha l'immagine posizionata come sfondo ma così non riesco a renderla linkabile...

[jubstuff]

Ecco, al posto del div contatti metti un link:

[url="#"]Contattaci[/url] 

e metti nel CSS

a:link#contatti,a:visited#contatti{
   background:url(i/tua_immagine.png) no-repeat top left;
   display:block;
   height:100px; //qui devi mettere altezza e larghezza della tua immagine
   width:100px;
   text-indent:-9999px;
} 

In questo modo, hai un markup pulito e accessibile (perchè il testo contattaci è solo nascosto dalla vista tramite text-indent), e l'immagine è messa come background del link. Nota che è necessario imporre display:block, altrimenti height e width non si applicano, in quanto il tag a è di default "inline"

[Sonea]

mmm... no, non funziona.
Vedo la scritta "Contattaci" e intravedo sotto la mia immagine come background.
Inoltre, non si sposta in basso al div e in Firefox vedo il colore di fondo soltanto attorno alla scritta, non essendoci più un div che contiene questo link.