Posted by dorayme on 04/04/06 02:20

In article <efv132pbb7d52ohssjl0mvpiifg0167ai8@4ax.com>,
sorry.no.email@spamsux.com wrote:
>several methods of using CSS to get a caption under images.
> These are images floated left and right as well as images centred by
> enclosing them in p tags. A typical page is:
>
> http://people.aapt.net.au/~adjlstrong/strongs/chapter_5.html
>
> At the moment I am depending on title tags alone on the images as
> most of the methods I have tried and read about are cumbersome and
> convoluted or depend on images being all the same size on a page.
>
> A great example is:
>
> http://www.alistapart.com/articles/practicalcss/
>

Well, there are complex issues here. For a start, this reference
uses pics all the same size and so will be no help on this
particular variable. But it is a nice example of some things, one
of them being that it does separate style from content which
should by now obviously be a good thing (whether over-riding is
another matter).

And it has the nice advantage of wrap. This is a very great
advantage for a page chock full of thumbnails. You won't get this
in tables, you will get scrollbars!

As for tables being easier to write up, yes, probably. But only
if you are judging crude looks. More subtle ones to accomodate
different sized thumbnails to line up nicely in some way and it
gets trickier even in tables.

> Can anybody suggest a straightforward way to put captions under all
> these images using CSS?

Well, he did! It was simple enough? You break, you text-align and
that is that. By the way, if you don't like the large space
between the pic and the caption, add a zero or smaller
line-height (assuming the caption is _not_ going to go on and on
to wrap)

If you are just captioning larger pictures, instead of your <p
class="centre"><img src="images/headstone.jpg" title="Headstone
of Joseph Strong" alt="Headstone of Joseph Strong" width="510"
height="283" /></p> use a div, style it to centre and so on. (i
am surprised, given you are using a centered p, that you did not
just go on and simply use a break and caption text in the p?

--
dorayme

[Back to original message]