Line break control
- Non-Breaking Space
- Non-Breaking Hyphen
- Adding Line Breaks
A non-breaking space can be added to text using one of the following codes:
- non-breaking space code
- a noWrap code
- a wrap-none code
Use the non-breaking space to do the following:
- prevent content from splitting over multiple lines, which reduces readability
- ensure that items (such as dates, names, numbers, percentages, some hyphenated words, certain phrases, etc.) do not become separated at the end of a line
- keep the last two words of a paragraph together to prevent a single word from appearing by itself on a line
- keep words at the beginning of a parentheses together with the rest of the text (e.g.
Below is a partial list of where to use the non-breaking space codes.
<span class="wrap-none">235 Queen Street
<span class="wrap-none">Jean Edmonds Building
URLs and email addresses:
Numbers and words:
<span class="nowrap">Prime Minister Harper</span>
<span class="nowrap">His Excellency the Right Honourable</span> David Johnston, <span class="nowrap">Governor General of Canada</span>
Use a non-breaking space to avoid breaking up text within a parentheses)
The code for non‑breaking hyphen is
‑. This code is useful for keeping items such as hyphenated words (e.g., those words with short prefixes like "e-" or "co-") and telephone numbers together on a line.
Adding Line Breaks
<br> tag inserts a single line break. This tag is useful for adding a line break when including addresses, etc.
Do not use multiple
<br> tags (e.g.
- separate paragraphs—use the
<p></p>tags instead; or
- add spaces between items in an unordered or ordered list—use
Line Break Opportunity (
<wbr> tag does not necessarily add a line break, it just specifies a line break opportunity where a line break can occur if one is required.
This tag can be used for very long words or for long strings of text with no spaces (such as long URLs) where you would like to control where the line break will occur. Without the
<wbr> tag, the word would either wrap at a strange place (making it difficult to read) or not wrap at all (thereby creating a large white space at the end of the line or pushing all the content to the next row).
The difference between the
<wbr> tag and the
<br> tag is that the
<br> tag forces a line break. The
<wbr> tag only adds a line break if one is necessary.
The Industry Canada <cite>Report on Plans and Priorities</cite> can be found at <a href="http://www.tbs-sct.gc.ca/rpp/2012-2013/index-eng.asp?acr=1970">http://www.tbs-sct.gc.ca/rpp/
The Industry Canada Report on Plans and Priorities can be found at http://www.tbs-sct.gc.ca/rpp/
If no line break was indicated, the following line break would occur:
The Industry Canada Report on Plans and Priorities can be found at http://www.tbs-sct.gc.ca/rpp/2012-2013/index-eng.asp?acr=1970
Rate this page
The content of this page was useful to me.
- Date modified: