|
|
Posted by dorayme on 09/21/05 06:06
> From: "jj" <no@spam.com>
> Hello,
>
> i have a series of images with text descriptions next to each one of them.
> all are placed within a table.
>
> my problem is that when there are too many text & images in the table the
> last image in the row automatically get placed in a new line, which is what
> you'd expect. this is fine for the most part except for one issue.
> sometimes the image and its description get split up so that in one line you
> would have the image and on the next the description.
>
> my question is how do i make the image and text "fuse" together so that if
> there is no space for the image or the text on the current row they BOTH get
> placed on a new line instead of one staying on the line above and the other
> breaking to a new line.
>
> Thanks for helping me.
>
>
If I may try my hand at a quick "fluffy" answer:
If you put the image and the text in the same cell, your
particular problem will disappear. If you can live with the text
underneath the pic, (often quite nice), just put the img, then a
<br>, then the text. If you want to align things nicely, you
need to use a bit of css. For example the <td> can be styled to
centre and pad things. You can use a div to hold all inside the
cell centered and style a <p> within the cell or within the div
within the cell so that you can centre the text left but the
whole p sits nicely in the centred div (underneath the pic). If
you want the text to the right or left, you can float the image
left and put the pic and text in the same cell.
If you can do all this after playing around, you might even get
to do without the table itself.
If you must have a table and the image in one cell, the text in
the next and like that, just make sure you finish the row after
a text cell, </td></tr> and start the new row <tr><td>... You
must judge how many pairs are likely on a line (allow say 600 px
for *the lot* to avoid folk scrolling horizontally. Thus if your
pics are small and thumb sized, you can have many pairs, but if
they are bigger, maybe only one pair of "pic/text" per line
Like this:
<tr><td>pic</td><td>text</td><td>pic</td><td>text</td></tr>
<tr><td>pic</td><td>text</td><td>pic</td><td>text</td></tr>
<tr><td>pic</td><td>text</td><td>pic</td><td>text</td></tr>
This won't break in the way you describe. If you are not worried
about horizontal scrolling for people with small screens, you
can have more on one line than I suggest.
I think you must have forgotten to put something like row close
or new row or something to get your symptoms?
dorayme¹
Navigation:
[Reply to this message]
|