HTML and CSS Reference
In-Depth Information
To Clear Text Wrapping
After specifying an image alignment and defining how text wraps, you must enter a break (<br />) tag to stop
the text wrapping. You use the <br style="clear: left" />" and the <br style="clear: right" /> tags to reset the margins
after you used code to wrap text around an image. If you did not insert this code to clear the wrapping, then all text
would continue to wrap. For instance, without the <br style="clear: left" /> code inserted below, the following text
(Colorful Lobster and the paragraphs beyond it) would continue just after the paragraphs about the Frog Fish. The
following steps show how to enter code to clear the text wrapping.
1
•
<Insert Clear left
here --> on line 57,
and then type
<br
style=”clear:
left” />
as the tag
(Figure 3-38).
Highlight the line
<br> tag with
clear left style
Figure 3-38
2
•
Highlight the line
<!--Insert Clear right
here --> on line 69,
and then type
<br
style=”clear:
right” />
as the
tag to clear the text
wrapping for both
left- and right-aligned
images, as displayed
in Figure 3-39.
What happens if
you do not use the
<br style=“clear:
direction” /> tag?
Your text following
the wrapped image
will not be displayed
as you intended. The
following text will
continue to wrap
beyond the end of
the text and image
combination.
<br> tag with
clear right style
Figure 3-39
Is there one tag to clear all alignments?
Yes. The <br style=”clear: both” /> tag clears all text alignments.
