[pmwiki-users] Image and Text Alignment
H. Fox
haganfox at users.sourceforge.net
Mon Feb 13 11:57:03 CST 2006
On 2/13/06, Hans <design at softflow.co.uk> wrote:
> To keep image and description always side-by-side together, and have
> each pair floated as one unit, one needs to bundle each pair into a
> div, and apply a float style to both image and description.
> The latter should also carry a width to force line breaks.
> A bottom margin for the floated divs keeps them vertically spaced.
> Paddings and borders can also be used.
> At the end all those floating "cells" need to be followed by a
> clear=both [[<<]] markup, to force subsequent text underneath.
>
> >>lfloat margin-bottom=10px<<
> %lfloat%image
> %lfloat width=150px%description......
> >>lfloat margin-bottom=10px<<
> %lfloat%image
> %lfloat width=150px%description......
> >>lfloat margin-bottom=10px<<
> %lfloat%image
> %lfloat width=150px%description......
> >>lfloat margin-bottom=10px<<
> %lfloat%image
> %lfloat width=150px%description......
> >><<
> [[<<]]
This one provided some inspiration for a table-based solution. (It
is, in fact, a table isn't it?)
(:table:)
(:cell style='padding:5px;':)
%lfloat margin-top=5px%image
description......
(:cell style='padding:5px;':)
%lfloat margin-top=5px%image
description......
(:cellnr style='padding:5px;':)
%lfloat margin-top=5px%image
description......
(:cell style='padding:5px;':)
%lfloat margin-top=5px%image
description......
(:tableend:)
http://www.pmwiki.org/wiki/Test/ImageTable
Hagan
More information about the pmwiki-users
mailing list