A cosa serve il posizionamento nel #container? Se non sai rispoondere toglilo.

Nel body (e probabilmente anche nell'html) manca:
width: 100%;


E in effetti ti manca il clear.
Quello che c'e` nel footer serve per il footer, ma non per allungare il #container.
In pratica nel tuo codice hai il #container vuoto, dato che i blocchi flottati vengono esclusi dal flusso della formattazione. E se il blocco e` vuoto, anche l'immagine di sfondo non viene vista.

Devi quindi applicare il clear, ad esempio come consigliato nella pillola citata, al blocco
#container:after { ... }