Impedire ai contenuti di un Container di spostarsi se si restringe il browser

[Dave Zed]

Buongiorno, sto realizzando un sito in cui vorrei creare un container senza margini, cioè che si adatti alla larghezza della pagina visualizzata sul browser.
Ho creato i seguenti codici.
Su html nel body:
<div id="container">
[img]immagine.jpg[/img]


Lorem Ipsmum Lorem IpsmumLorem IpsmumLorem IpsmumLorem
IpsmumLorem IpsmumLorem IpsmumLorem IpsmumLorem
IpsmumLorem IpsmumLorem IpsmumLorem Ipsmum </p>
</div>
Su CSS:

html, body {
height: 100%;
margin: 0;
padding: 0;
}

#container { margin-left: auto;
margin-right:auto;
background-color:#0FC;
min-height:200px; }

# img { float:left;}

p { float:right; }

Il mio problema è questo: se provo a rimpicciolire la finestra del browser, la scritta del

va ad inserirsi automaticamente al di sotto dell'immagine #img: probabilmente dipende dal fatto che non ho inserito in #container una larghezza; infatti se scrivo ad esempio width:900px; il problema non si verifica, ovvero se restringo il browser la scritta scompare pian piano.
Io però vorrei, come dicevo, fare in modo che il container sia largo quanto la finestra del browser: ho provato a dare al html, body ed a #container {width:100%; }, ma non è servito a niente.
Come posso fare? Grazie.

[Prill]

Elimina il float:right sul paragrafo. Meglio non usare come nomi dei selettori nomi di tag (#img, meglio #image o qualsiasi altra cosa)

[Dave Zed]

Originariamente inviato da Prill
Elimina il float:right sul paragrafo. Meglio non usare come nomi dei selettori nomi di tag (#img, meglio #image o qualsiasi altra cosa)

no non è quello il problema, ho provato a togliere il float, ma il testo continua a spostarsi.
Come dicevo il problema nasce dal fatto che all'interno di #container non ho inserito nessun width, perché vorrei che non ci fosse margine...