nicht angemeldet
Sieh' dir den Code mal genau an:
float: left bedeutet, dass das Element links "treibt" und anderes "Treibgut" (nachfolgende Elemente) rechts daran vorbeifließen kann.
Sprich: - deine linke Spalte ist mit einer festen Breite ausgestattet und ermöglicht es anderen Elementen rechts daneben Platz zu finden.
#rechts hat einen Abstand zu linken Seite von 700px (was der Breite der linken Spalten entspricht) - eine Breite hat sie nicht. Nachdem es ein div-Element ist (und es sich um ein Block-Element handelt) nimmt es die verfügbare Breite (abzüglich des linken Außenabstands) ein.
Selbriges Verhalten lässt sich natürlich auf umdrehen.
btw: nennen deine Elemente lieber nicht #links und #rechts - da das Verhalten schnell per CSS umgedreht werden kann (oder völlig verändert) kann die rechte Spalte plötzlich auf der linken Seite sein[1] - oder aber beide sind untereinander.
Sinnvolle Namen sind z.B. "inhalt1", "inhalt2" oder "spalte1", "spalte2 - nummeriert anhand ihrer logischen Abfolge im Quelltext (nicht entsprechend ihrer visuellen Abfolge).
[1] das kann zb. bei mehrsprachen Seiten der Fall sein, wenn ein ltr und rtl-Schriftsysteme wechseln.