NOBR tag CSS alternative/analog
| abstract |  |
Sometimes it is necessary to put series of non-breaking spaces between words, to ensure that browser will not break line. Using multiple (non-breaking space entity) is quite messy and <NOBR> from older versions of HTML is not defined in XHTML standard. This articles tells about CSS property which can substitute <NOBR> tag
| compatible | |
- CSS 2 and higher
Use CSS property “white-space: nowrap” for an element, which should contain non-breaking text.
You could add style class like .nobr and use it later instead of <NOBR> tag:
source code: CSS
.nobr {white-space: nowrap}
Example:
source code: XHTML/CSS
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Empty XHTML 1.0 Strict Document</title>
<style type="text/css">
.nobr {white-space: nowrap}
</style>
</head>
<body>
<p>Test table #1 (word-wrapping):</p>
<table style="width: 100%; margin-bottom: 3em; border: 1px solid black;">
<tr><td style="width: 1%;">
Popular keywords: free hosting CSS HTML guide
tutorial information web-design
</td>
<td style="width: 99%; background-color: #CFF;">|</td>
</tr>
</table>
<p>Test table #2 (nobr CSS class):</p>
<table style="width: 100%; border: 1px solid black;">
<tr><td style="width: 1%;">
<div class="nobr">Popular keywords: free hosting CSS HTML
guide tutorial information web-design</div>
</td>
<td style="width: 99%; background-color: #CFF;">|</td>
</tr>
</table>
</body>
</html>
