add more divs .
#div 1 (contains image and text)
— #div 2 (contain image)
#div 1 {
width : wahtever% ; /**Bigger then image and #div2**/
}
#div 2 {
float :left;
}
That is it –
if you really want to over-do you can add
{
clear:none;
}
Thread Starter
kothea
(@kothea)
That’s what I thought but I can’t get it to work for the life of me. there needs to be multiple lines of wrapping text down the side of the image which then continues underneath the image.
<div id="container">
<div id="content" >
<div id="floatingimg"><img src="images/home.jpg"/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque et felis quis lacus suscipit placerat. Donec porttitor vehicula fermentum. etc etc...a lot of text.
</div>
</div>
<div id="sidebar" >Menu</div>
</div>
#content {
min-width: 478px;
min-height:700px;
float: left;
}
#content floatingimg {
width: 249px;
height: 369px;
float: left;
min-height:700px;
margin-right: 200px;
}
Thread Starter
kothea
(@kothea)
i’ve tried with the <p> bits as well but can’t get it to work.
Float:left; is all you need .
in your code, the <p> element (inline) with the text is INSIDE the #floatingimg id
further more, you can not declare 2 ID´s and then this :
#content floatingimg {
width: 249px;
height: 369px;
float: left;
min-height:700px;
margin-right: 200px;
}
either use commas, or in your case, you MUST seperate them.
Alco , do not use ID , but classes, because i immagine you would want MORE then one image on a page.
#content .floatingimg
see also here and here
Thread Starter
kothea
(@kothea)
Sorted, thank you very much
