Here is the jsfiddle
of the below code. http://jsfiddle.net/ux4DD/. What I want is the name Harry Pham
to be in one line, so I make the width very small and do white-space:nowrap
. It work on Firefox, but not IE. Help please
<table cellpadding="0" cellspacing="0" style="width: 450px;">
<tr>
<td>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td style="width:20px;border-top:1px solid gray;white-space: nowrap;"><span class="linkColor">Harry Pham</span>
</td>
<td style="height:15px;background:url('images/line.png') no-repeat;width:28px;" width="35px"></td>
<td style="border-bottom:1px solid gray;" width="auto"></td>
</tr>
</table>
</td>
</tr>
</table>
nowrap : Multiple whitespaces are collapsed into one, but the text doesn't wrap to the next line.
If you want to prevent the text from wrapping, you can apply white-space: nowrap; Notice in HTML code example at the top of this article, there are actually two line breaks, one before the line of text and one after, which allow the text to be on its own line (in the code).
Yes, the whitespace here does matter. Typically spaces don't matter, but CSS functions are sensitive like that.
nowrap. Sequences of whitespace will collapse into a single whitespace. Text will never wrap to the next line. The text continues on the same line until a <br> tag is encountered.
For IE 6 and 7 you need to wrap your text with a <span>
tag and give it a white-space
property. Since you already have a <span>
tag wrapped around your text and you have a class for it, just add the white-space
property to your <span>
class .linkColor
.
.linkColor{
white-space:nowrap;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With