CSSClearProperty

How to use CSS clear property to clear left or right only

>>rfloat<<
Attach:bushtrack.jpg
Attach:bushtrack.jpg
>><<
%lfloat%Attach:bushtrack.jpg
One of the best activities to do in New Zealand is tramping.
Tramping is hiking in the New Zealand bush.
%clear:left red%This text should be under the left image, but not under the right images.

One of the best activities to do in New Zealand is tramping. Tramping is hiking in the New Zealand bush. This text should be under the left image, but not under the right images.



>>rfloat<<
Attach:bushtrack.jpg
Attach:bushtrack.jpg
>><<
%lfloat%Attach:bushtrack.jpg
One of the best activities to do in New Zealand is tramping.
Tramping is hiking in the New Zealand bush.
>>clear:left red<<
This text should be under the left image, but not the under right images.
>><<

One of the best activities to do in New Zealand is tramping. Tramping is hiking in the New Zealand bush.

This text should be under the left image, but not the under right images.



surely it is not this hard
>>rfloat<<
Attach:bushtrack.jpg
Attach:bushtrack.jpg
>><<
%lfloat%Attach:bushtrack.jpg
One of the best activities to do in New Zealand is tramping.
Tramping is hiking in the New Zealand bush.
(:div style="clear:left" red:)(:divend:)
This text should be under the left image, but not the under right images.

One of the best activities to do in New Zealand is tramping. Tramping is hiking in the New Zealand bush.

(:divend:)

This text should be under the left image, but not the under right images.


Could you attach an image(sketch) as how the layout should be. I could give a try.
VKrishn August 23, 2010, at 04:52 AM

the third (bottom) example largely achieves what I want, but having to use a "div" seems to be overkill. Perhaps we need some variants on [[<<]] which is break clear:both, in the standard markup, eg [[_<]] and [[<_]], thanks, Simon
Your proposed markup could help in some layouts, I guess complex layouts now can be done in html5. VKrishn August 24, 2010, at 02:54 AM
Thanks. I don't consider this to be complex at all, this is basic CSS. There is something missing in the way >><< and %css% work IMHO. I should not have to hard code image widths. simon August 25, 2010, at 05:31 AM

yes it can become difficult..
>>rfloat<<
Attach:bushtrack.jpg
Attach:bushtrack.jpg
>><<
>>lfloat width=314px<<
Attach:bushtrack.jpg\\
This text should be under the left image, but not the under right images.
>><<
%lfloat%
One of the best activities to do in New Zealand is tramping. Tramping is hiking in the New Zealand bush.%%

This text should be under the left image, but not the under right images.

One of the best activities to do in New Zealand is tramping. Tramping is hiking in the New Zealand bush.


 0: 00.00 00.00 config start
 1: 00.01 00.01 config end
 2: 00.21 00.21 MarkupToHTML begin
 3: 00.21 00.21 MarkupToHTML begin
 4: 00.22 00.21 MarkupToHTML end
 5: 00.22 00.21 MarkupToHTML begin
 6: 00.22 00.22 MarkupToHTML end
 7: 00.22 00.22 MarkupToHTML begin
 8: 00.22 00.22 MarkupToHTML end
 9: 00.22 00.22 MarkupToHTML begin
10: 00.22 00.22 MarkupToHTML end
11: 00.23 00.23 MarkupToHTML end
12: 00.24 00.23 MarkupToHTML begin
13: 00.24 00.24 ReadApprovedUrls SiteAdmin.ApprovedUrls begin
14: 00.25 00.24 ReadApprovedUrls SiteAdmin.ApprovedUrls end
15: 00.25 00.25 MarkupToHTML end
16: 00.25 00.25 MarkupToHTML begin
17: 00.26 00.25 MarkupToHTML end
18: 00.26 00.26 now
Peak memory: 3,774,152 bytes