✔ CSS Positionierungs Problem

[Starfox2007]

Hi zusammen,

Ich möchte in meinem Header 3 Bilder nebeinander Positionieren.

<div id="header">
    
    <div class="header_left"></div>
    <div class="header_middel"></div>
    <div class="header_right"></div>
    
 
    
    </div>

Hier die CSS dazu:

#header {
margin-top:5px;	
width:976px;
height:215px;
}

.header_left {
width:306px;
height:215px;
background-image: url("../topleft.png");
background-repeat:no-repeat;
margin-left:0px;
float:left;
}

.header_middel {
margin-left:306px;	
width:382px;
height:215px;
background-image: url("../topmiddel.png");
background-repeat:no-repeat;
}

.header_right {
margin-left:688px;
width:288px;
height:215px;
background-image: url("../topright.png");
background-repeat:no-repeat;
float:right;
}

Mein Problem das rechte Bild ist nie neben den anderen beiden sondern unterhalb. Ich kann das ganze nur beheben indem ich margin-top:-200px; einfüge oder die DIV´s im Index vertausche sprich:

<div class="header_left"></div>
<div class="header_right"></div>
    <div class="header_middel"></div>

Warum ist das so ? Hab ich einen Fehler irgendwo drin ?

 

[mäks]

Hallo Starfox2007

Das Problem hatte ich auch lange Zeit!

Versuche einmal alle Boxen left zu floaten und am Schluss unten dann noch ein clear: both zu setzen.

Das Clear: both beendet den Float-Fluss von den Boxen soweit ich weiß.
Mit Float Left sollten dann alle aneinander geheftet sein.

Bitte schau aber auch dass alle Boxen nebeneinander stehen können (width, height). Kann auch oft sein dass die Boxen zu groß sind und sich dann den Platz wo anders suchen .


Maks

 

[timestamp]

Bist du dir sicher dass der befehl float: clear; heißt, und nicht etwa

clear: both;

 

[timestamp]

Wäre mir unbekannt, finde auch nichts bei der Suchmaschine meines Vertrauens

 

[Starfox2007]

Habs in den Griff bekommen, komischerweise geht es jetzt ganz normal warum auch immer das so war.

die ersten beiden mit float:left das ganz rechte Bild mit float:right;

Glaube ich hab mich bei der Bildgröße vertan

Danke an alle für die Hilfe