Guys, thanks for the suggestions... The problem with clear: left; used in the main content area is that it not only clears the image, but also the bottom of the search box in the left-had column! So I guess the question then becomes can I stop the interaction between the floated elements in the left column and the clearing elements in the main content area?
Peter. Basic layout: http://design.open.ac.uk/individual_pages/jeff_johnson/ people_jeff_johnson.htm On 6 Mar 2006, at 17:16, Cunniff, CJ wrote: > I believe you can just use the following style on the next section: > > style="clear: left;" > > Of course, you could also do that within your style sheet instead on > inline. > > Hope that helps, > CJ > > -----Original Message----- > From: [EMAIL PROTECTED] > [mailto:[EMAIL PROTECTED] On Behalf Of Peter Lloyd > Sent: Monday, March 06, 2006 11:12 AM > To: css-d@lists.css-discuss.org > Subject: [css-d] simple problem? > > Hi, > > Is it possible to force text to go below floated elements? > > I have an image floated left with some related text flowing to the > right. But I want to begin the next section of text below the floated > image and tight to the left margin (see 1). At the moment the next > section of text simply begins to the right of the image and flows > round > the image (2). > > (1) > --------------- text text text > | | text text text > | | text text text > | | > | | > --------------- > Next section > Next section > Next section > > (2) > --------------- text text text > | | text text text > | | text text text > | | > | | Next section > --------------- Next section > Next section > Next section > > Is there any way to guarantee that 'Next section' always begins below > the image floated left (even if the size of the image varies on > different pages? > > I've tried (1) carriage returns but these render differently in > different browsers, (2) a fixed height div surrounding the image and > text but this provides problems with rendering when the right text > goes > below the image - 'Next section' appears written over the text. > (3) using a table but this interacts with the menus in the left hand > column. > > Thanks for any help, > > Peter. > > An example of the basic page layout is at: > > http://design.open.ac.uk/individual_pages/jeff_johnson/ > people_jeff_johnson.htm > ______________________________________________________________________ > css-discuss [EMAIL PROTECTED] > http://www.css-discuss.org/mailman/listinfo/css-d > IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 > List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by > evolt.org > -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
