Alignment problem

[Guest kerminator]

Probably a simple question for html and css afficiandos - I've got an html table cell into which I want to place a small image1 in the top left, some text to the right of image1 that will wrap around image1 over to the left border of the cell if enough text is present, and a larger image2 in the right of the cell that bumps the top, right, and bottom borders of the cell. Like so:

 

image1 Here is where there will be a large amount image2

image1 of text that could potentially wrap around image2

image1 the image1 if there is enough text to image2

cause that to happen, like it does here. image2

image2

image2

image2

 

Image2 is of fixed size and always the same. Image1 dimensions could change, as could the amount of text, since the content is dynamically determined at runtime.

 

How do I get this to happen? I've tried all manner of CSS floats and margin-xxxx settings to no avail.

 

Thanks!

[newseed]

Hmm...you may have to draw up a visual example and so I am only guessing here based on what you said

 

image1 - float: left;

image2 - float: right;

text - float: left;

 

The cell itself is typcially vertically aligned in middle and so you may have apply vertical-align:top specifically for that cell.

 

The html order:

 

<td style="vertical-align:top">

<img src="image1" style="float: left;">

<img src="image2" style="float: right;">

<p style="float: left;">text</p>

</td>