On 12 Nov, 01:39, "JG" <NoMail@NoSpamwrote:
I notice when I resize my webpage it adjusts the line returns
so that all of the text is still shown. While this is great for a text only
webpage, it causes undesirable results for a page with photos
inserted at various places with text wrapping.
Yes, this isn't desirable. The fix though isn't to clip things, or to
stop text flowing, it's to control _how_ things flow. In particular,
you probably have a number of "sections" of text and a number of
related images. Provided that each block remains nearby to the
relevant image, the page still "works". However treating all the text
as one very long block and flowing it in a single unit past all the
images certainly won't.
In the simplest way, just use containment. Place each "section" of
text (possibly many paragraphs) inside a separate <divand place the
<imgin there too.
Another way is to use floats. Place each <imginside a <div>
container (possibly with a line of caption text too) and float them.
The place the text inside a single sequence of <pelements and allow
it to flow round the images. To keep things synchronised, use <hr>
elements with the clear property set, interspersed with the <pas
needed. By appropriate use of clear and putting the <hrat the right
places between the <p>, you can synchronise images and text.
http://brainjar.com/css/positioning/ is a good background tutorial.
