CSS mit float

[schubste]

Hallo Zusammen,
Ich.....Anfänger... habe jetzt 5 Stunden herumprobiert....ich bekomme es einfach nicht hin :( Es ist sicherlich ganz simple..... Ich habe einen Content auf dem ich eine Sidebar links, ein Textfeld und eine Sidebar rechts anordnen möchte. Leider landen die Drei genannten Dinge nicht auf meinem Content. (siehe Bild, der Content ist der kleine schwarze Streifen oben :(

ich habe folgenden html Code geschrieben:

<div id="content">
<div id="sidebar1"><p>Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1</p>
</div>
<div id="text"><p>Textfeld<br />
Textfeld<br />
Textfeld<br />
Textfeld<br />
Textfeld<br />
Textfeld</p></div>
<div id="sidebar2"><p>Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2</p></div>
</div>

mein css sieht so aus:

#content {height: auto;
width: 1000px;
margin: 0 auto;
padding: 10px 0;
background: #000;
}

#sidebar1 {width: 210px;
height: auto;
background-color:blue;
float: left;
margin-bottom: 10px;
margin-right:10px;}

#text {width: 560px;
float: left;
margin-bottom: 10px;
height: auto;
background-color:#666}

#sidebar2 {width: 210px;
height: auto;
margin-bottom: 10px;
float: right;
background-color: blue;}

ich bin für jede Hilfe sehr dankbar!

viele Grüße

 

[scbawik]

Hallo Zusammen,
Ich.....Anfänger... habe jetzt 5 Stunden herumprobiert....ich bekomme es einfach nicht hin :( Es ist sicherlich ganz simple..... Ich habe einen Content auf dem ich eine Sidebar links, ein Textfeld und eine Sidebar rechts anordnen möchte. Leider landen die Drei genannten Dinge nicht auf meinem Content. (siehe Bild, der Content ist der kleine schwarze Streifen oben :(

ich habe folgenden html Code geschrieben:

<div id="content">
<div id="sidebar1"><p>Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1<br />
Sidebar Nummer 1</p>
</div>
<div id="text"><p>Textfeld<br />
Textfeld<br />
Textfeld<br />
Textfeld<br />
Textfeld<br />
Textfeld</p></div>
<div id="sidebar2"><p>Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2<br />
Sidebar Nummer 2</p></div>
</div>

mein css sieht so aus:

#content {height: auto;
width: 1000px;
margin: 0 auto;
padding: 10px 0;
background: #000;
}

#sidebar1 {width: 210px;
height: auto;
background-color:blue;
float: left;
margin-bottom: 10px;
margin-right:10px;}

#text {width: 560px;
float: left;
margin-bottom: 10px;
height: auto;
background-color:#666}

#sidebar2 {width: 210px;
height: auto;
margin-bottom: 10px;
float: right;
background-color: blue;}

ich bin für jede Hilfe sehr dankbar!

viele Grüße

overflow:hidden auf den container.

 

[schubste]

vielen herzlichen Dank :) Eine Frage habe ich noch. Habe "padding" bei dem Container jetzt entfernt. Ich dachte, jetzt müssten die drei Felder mit dem Container übereinstimmen. Aber aus irgendeinem Grund ist der Container jetzt länger und steht unten über. (siehe Bild) Wie bekomme ich denn das noch in den Griff.

Besten Dank

 

[Xeno]

Hallo schubste

Gib bitte den Link zur Seite an, dann ist Hilfe viel einfacher. Und poste Code in den Tags (Einfügen/Code).

Lg X.

 

[scbawik]

vielen herzlichen Dank :) Eine Frage habe ich noch. Habe "padding" bei dem Container jetzt entfernt. Ich dachte, jetzt müssten die drei Felder mit dem Container übereinstimmen. Aber aus irgendeinem Grund ist der Container jetzt länger und steht unten über. (siehe Bild) Wie bekomme ich denn das noch in den Griff.

Besten DankAnhang anzeigen 3867Anhang anzeigen 3867

margin-bottom weg?