Don P: wie wäre es...en

Beitrag lesen

Hallo,

Grafik UND blaues div haben locker Platz im roten div - trotzdem passiert ein Zeilenumbruch und das blaue div rutscht darunter. WARUM zum T.... nochmal???

DIV ist ein Block-Element und IMG ein inline-Element. Die können nicht immer so einfach miteinander, wie die Leute auf deinem Bild.

So geht's z.B.:

div#rot {
height: 450px;
width: 675px;
margin: auto;
border: 5px solid #ff0000;
background-color: #ff0000;
}
div#blau {

float: right;

height: 300px;
width: 300px;
background-color: #0000ff;
}


>   
>   
> ~~~html
  

> <div id="rot"><img src="fotos/hochzeit/01.jpg" alt="">  
> <div id="blau"></div>  
> </div>

Und so auch, wenn das Bild rechts rausragen soll:

div#rot {  
height: 450px;  
width: 675px;  
margin: auto;  
border: 5px solid #ff0000;  
background-color: #ff0000;  
}  
  
div#bild {margin-left:450px}  
  
div#blau {  
float: left;  
height: 300px;  
width: 300px;  
background-color: #0000ff;  
}
<div id="rot">  
<div id="blau"></div>  
<div id="bild"><img src="01.jpg" alt=""></div>  

Das mit dem Einpacken in DIV und mit margin wurde dir aber oben schon gesagt.

Gruß, Don P