Hi

I have some images that I want to float on the left of the text, but when these images extend past a page they do not continue on the next page but disappear. Any ideas how I can make the images display properly?

The code below displays the text on the right half of the screen and the images on the left which is fine but only the images on the first page show. If there are more images that I want to flow down on to the next page they don't display.

here is the html:

<div class="section">

 <div id="images1">
   <h4>Image 1</h4>
   <img ... />
   <h4>Image 2</h4>
   <img ... />
 </div>

 <h3>Text here</h3>
 <p>Blah blah...</p>
 
</div>

and the css:

.section {
 margin-left: 50%;
}

#images1 {
 float: left;
 margin-left: -100%;
 width: 100%;
}

I have also tried with absolute positioning but the same problem occurs.

<><

I've just been playing around with it and the funny thing is that if I float a div that contains just text it extends to as many pages as it needs no problem; but the div that contains images gets cut off after the first page. Perhaps it is something to do with images?

<><

Well, I haven't been able to get it to work properly, but I have side stepped the issue by changing the order of the source so that images appear at the correct place.

<><