aligning text and image in a table cell

[fb18]

I want to display some text and an image in one table cell (and dont want to use a nested table) At the moment I have the text floating to the left of the cell and the image floating to the right. The problem is that the column in the table seems to be automatically resizing to fit the text and not the image. I want to end up with the text on the left of the cell and the image on the right. At the moment some of the cells line up ok but others (with longer text) end up pushing the image underneath the text.(still on the right side of the cell) I dont want the image under the text I want it next to it.

Hope I explained that properly. Anyone know how I can stop this?

 

[Vragabond]

How about if you only float the image? Put it before text, float it to the right and text should flow around that image on the left.

 

[fb18]

Thanks, I tried that but im still getting the same problem. Seems that the table is taking the longest line of text and sizing the column to fit that and then pushing the image underneath. Obviously with smaller lines of text the image appears next to the text which is what I want. I thought that a column should resize to fit the contents of the cell unless a width is specified. I havent specified a width so it should fit.If i specify a width for the column it all works fine. Problem is the table is populated via a loop in a perl script so I cant easily set an individual column width.

 

[Vragabond]

Can you show us the code, or even better, give us a link to the site?

 

[fb18]

I cant give you a link but I can try to show you the part of the code im having problems with. This is part of a perl script which basically shows you what im trying to do with the table cells. Above the if statement I have the <table> and <td> tags. The bit of code below is in a loop. Hopefully its enough for you to see what im trying to do. The $$variable stuff refers to a value within the perl script.

if (!@array) { 
	
#print the details with no link

print <<ROW;

<span style = "float:left" >$$variable{'$column'}</span>

<a href ="script.pl?var=$$variable{'variable'}" style = "float:right"> <img src="/img.gif"  border = "0"> </a>
ROW
#}
}else{
#print the details with a link

print <<ROW;

<a href="script.pl?var=$$row{'variable'}" style = "float:left" >$$variable{$column}</a> 

<a href ="script.pl?var=$$row{'variable'}" style = "float:right" > <img src="/img.gif" border = "0"> </a>
ROW

}

 

[Vragabond]

It is hard to determine what is going on here. Could you paste the source of the final rendered page, without perl code. I see you're still floating both text and image. This will not work, because if the width is not specified (which is not for text) for a block level, it will be either assumed 100% (which will push your image down) or auto (which will push your image down, when there's enough content).

 

[fb18]

Im afraid I cant post the source code (dont think im allowed to). I guess that means we have come to a bit of a dead end. From what you know so far though do you have any suggestions for me to look into? You can see what im trying to do so are there any ways around the problem?

 

[Vragabond]

I can't really see why you can't post the parsed perl script and you cna post the unparsed. You can replace the text with Lorem ipsum... or something, I am more interested in what html code does the loop exactly produce to do some testing.

 

[fb18]

Thanks for your help, ive sorted it out now with a bit of javascript which basically works out the longest column and makes it slightly longer..... probably not ideal but it works.