2 DIVs nebeneinander funktioniert nicht!?

[Harzteufel]

Hallo, ich habe folgenden Code, der zwei DIVs nebeneinander, mit Hilfe des float-Befehls, darstellen soll. Firefox und Opera zeigen es wie gewünscht an, nur der IE setzt das zweite DIV nach unten... Ich hab bestimmt nur ne Kleinigkeit übersehen, konnte sie aber bisher nicht allein finden. Hier der Code:

<div id="container">
   <div id="links">
        Inhalt links
   </div>
   <div id="rechts">
        Inhalt rechts
   </div>
   <div id="rechts">
       Inhalt 2 rechts
   </div>
</div>

Und hier der CSS-Code:

#container {
	margin: 0 auto;
	width: 825px;
}
#links {
	float: left;
	width: 400px;
}
#rechts {
	margin-left: 425px;
	padding: 15px;
	width: 400px;
	border-left: 5px solid #CCC;
}

Vielen Dank für Eure Hilfe.

 

[Dennis Wronka]

Probier es mal hiermit:

#container {
        margin: 0 auto;
        width: 825px;
}
#links {
        float: left;
        width: 400px;
}
#rechts {
        float:right;
        padding: 15px;
        width: 400px;
        border-left: 5px solid #CCC;
}

 

[Harzteufel]

Super, funktioniert. Danke! Ich sag ja, man ist manchmal so verbohrt in eine Sache... ;-)
Aber müsste es nicht auch mit meiner Variante funktionieren?

 

[Watusimann]

Sofern ich mich noch dunkel erinnern kann, sollte eine id (#) nur einmalig benutzt werden oder täusche ich mich da?

<div id="container">
   <div id="links">
        Inhalt links
   </div>
   <div id="rechts">     <!----- id - die erste -->
        Inhalt rechts
   </div>
   <div id="rechts">     <!----- id - die zweite -->
       Inhalt 2 rechts
   </div>
</div>

Man sollte in dieser Variante Klassen benutzen.

<div id="container">
   <div id="links">
        Inhalt links
   </div>
   <div class="rechts">
        Inhalt rechts
   </div>
   <div class="rechts">
       Inhalt 2 rechts
   </div>
</div>

und der CSS sollte dann so aussehen

#container {
        margin: 0 auto;
        width: 825px;
}
#links {
        float: left;
        width: 400px;
}
.rechts {
        float:right;
        padding: 15px;
        width: 400px;
        border-left: 5px solid #CCC;
}

 

[Maik]

Hi.

Sofern ich mich noch dunkel erinnern kann, sollte eine id (#) nur einmalig benutzt werden oder täusche ich mich da?

Nein, du täuscht dich da nicht.

Eine ID darf im HTML-Dokument nur einmal vergeben werden, eine Klasse hingegen "unendlich".