Align Text to Block

Hello, I have a question about text positioning in a table field.

In particular, I want to create a template which works with images
of unknown size.

There is a <table> field, in which I need to put:

* a <div> supplied to the template, that contains an image of unknown
size (this needs to be centered horizontally)
* a caption supplied to the template to put below the image
(_left_aligned_ with the image).

The field width (enforced by the rest of the table) may be larger than
the image, so a simple

<div ...>IMAGE
<div style="text-align:left;">caption</div>
</div>

won't work, as it will look like this:

+-------------------+ fig. 1

+---------+ |
| image | |
| | |
+---------+ |
caption |
+-------------------+

and I want it like this:

+-------------------+ fig. 2

+---------+ |
| image | |
| | |
+---------+ |
caption |
+-------------------+

Any ideas would be greatly appreciated!

TIA,
Stanislav

PS: code for fig. 1:

<table style="border: 1px solid;">
<tr><td style="text-align: center;">
<div style="background:lightgreen;">
<div><img style="border: 2px solid;" src="..." alt="IMAGE IS HERE"/></div>
<div style="text-align: left">caption</div>
</div>
</td></tr>
<tr><td>other field that makes table wide, quite wide in fact.</td></tr>
</table>

I wrote:

Hello, I have a question about text positioning in a table field.
[...]

.... no answers, no flames :-). I'm going to reword my question in the
hope that it will be quicker to follow.

I'm looking for a way to align a caption to it's image. The image is
centered, the caption below should be left-aligned with the image.

Monospace illustration follows:

+-------------------+

+---------+ |
|~image~~~| |
|~~~~~~~~~| |
+---------+ |
caption |
+-------------------+

We're in a table field, but that shouldn't matter.
Tricky part: we don't know the size of the image.

Anyone?

cheers,

--
Stanislav Traykov http://home.in.tum.de/~traykovs/

On Sat, 28 Aug 2004 22:42:56 +0000 (UTC), Stanislav Traykov
<news (AT) tortoises (DOT) org> wrote:

I wrote:
Hello, I have a question about text positioning in a table field.
[...]

... no answers, no flames :-). I'm going to reword my question in the
hope that it will be quicker to follow.

I'm looking for a way to align a caption to it's image. The image is
centered, the caption below should be left-aligned with the image.

Monospace illustration follows:

+-------------------+
| +---------+ |
| |~image~~~| |
| |~~~~~~~~~| |
| +---------+ |
| caption |
+-------------------+

We're in a table field, but that shouldn't matter.
Tricky part: we don't know the size of the image.

If you're combining text and images, you more or less have to make some
sort of assumption about sizes. I don't know any layout that will look
good with a 100px image with a 100-word caption, and also look good with
a 600px image and a one-word caption.

Personally I would approach it as follows (though neither does what you
ask):

- if the caption is normally multiline: left align it within the table
cell and centre the image within the table cell;

- if the caption is normally shorter than the image: centre both the
image and caption within the cell.

If it is for some reason vitally important to do what you ask, I don't
see an alternative to using server-side processing to calculate and
insert a box-width at the moment the image size becomes known; something
like: width: 15em; min-width: 180px; (untested)

(and then work out how to get it looking reasonable in Internet
Explorer, which still doesn't support min-width ...)

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

Stephen Poley <sbpoleySpicedHamTrap (AT) xs4all (DOT) nl> wrote:

On Sat, 28 Aug 2004 22:42:56 +0000 (UTC), Stanislav Traykov
news (AT) tortoises (DOT) org> wrote:

+-------------------+
| +---------+ |
| |~image~~~| |
| |~~~~~~~~~| |
| +---------+ |
| caption |
+-------------------+

Personally I would approach it as follows (though neither does what you
ask):

[1.] if the caption is normally multiline: left align it within the table
cell and centre the image within the table cell;

[2.] if the caption is normally shorter than the image: centre both the
image and caption within the cell.

If it is for some reason vitally important to do what you ask, I don't
see an alternative to using server-side processing [...]

#2 (center both) is what I currently do, but that is incompatible
with the site's convention for placing image lables. Server side
processing to obtain image width is impossible for various reasons. I
guess I will have to resort to a table for layout. (Pray for my soul
;-)

--
Stanislav Traykov http://home.in.tum.de/~traykovs/