[css] problem z wyświetlaniem pod FF i Opera

[Spanner]

Witam,
mam pewien problem, na stronie mam taki oto kod

Kod: Zaznacz cały

<div id="footer">
<div id="copyright"><p>tekst</p></div>
<div id="copy">tekst</div>
</div>

i do tego css

Kod: Zaznacz cały

#footer {
margin: 10px auto 5px auto;
width: 800px;
padding:0;
text-align: left;
}

#copyright {
padding-left: 10px;
float: left;
border-left: 3px solid #fff;
margin-top: 6px;
margin-right: 0;
padding-right: 0;
width: 303px;
}

#copyright p {
margin: 0;
padding: 0;
}

#copy {
width: 497px;
float: right;
border-top: 1px solid #fff;
padding-top: 5px;
margin: 0;
padding-left: 0;
}

i mam taki problem w IE wszystko jest tak jak powinno to wyglądać,natomiast w FF i Operze mam takie coś że <div id="copy"> jest wyświetlane dopiero pod tekstem umieszczonym w id="copyright" a powinno być to wyświetlane na równi. może mi ktoś pomóc co zmienić aby ff i opera wyświetlała, oba divy na jednej wysokości a nie jeden pod drugim


aha tylko nie chodzi mi o zwężenie prawej strony, bo wtedy zamierzony efkt wyglądu mi się psuje, bo psuje mi lay

[123456]

IE nie bierze pod uwagę wartości padding i border, które rozszerzają element.
footer musi być szerszy niż 800px.

Kod: Zaznacz cały

width: 303px; 
(...)
width: 497px; 
(..)
padding-left: 10px;
(...)
border-left: 3px solid #fff; 
/*
303 + 497 + 10 + 3 = 813
*/

Element footer musi mieć szerokość 813px;

[Spanner]

ok rozumiem, ale jak zmniejszyłem lewą stronę to w ff i operze ten div ucieka zupełnie do góry a powinien się czymać sztywno div id=footer więc już nie wiem co zrobić