开发者

HTML Tables - How to make IE not break lines at hyphens

I have some table cells containing dates formatted like this: 2009-01-01. I.E 7 seems to be breaking these in开发者_运维技巧to two lines at the hyphen. Is there any way to turn this off?


You are looking for the white-space property, which affords you control over how white space and line-breaks affect the content of your element. To collapse white space sequences, but prevent line-breaks, you can use the nowrap value:

.dates {
    white-space: nowrap;
}
<td class="dates">2009-01-01</td>


I'm sure there's a better CSS way but the old way is with a no-break: <nobr>...</nobr> but using no-break will cause nothing to go to the next line.

Another way is to use a Non-breaking hyphen. This way, you can still get wrapping, just not at the hyphen.


Use this CSS:

.nowrap {
    white-space: nowrap;
}

Wrap your dates like: <span class="nowrap">2009-01-01</span>.

Edit: the advantage of this solution over others is that it gives you more precise control over what should or should not wrap. Your cells may still wrap for spaces and other hyphens, outside the span.


I've tried all these suggestions. None worked. Found the solution on another Stack Overflow page: No line-break after a hyphen. You can use the code for non-breaking hyphen, &#8209;.


increase the size of your TD and it wont be a problem


This is NOT the correct way of answering your question, but this is how I do it:

<td>Hello&nbsp;-&nbsp;World</td>

I like this method better because you do not need to add a <style> or class attribute. Also, it makes the text one string so that it cannot be line wrapped by the browser.

Like I said, most people would disagree, but I think this is where a practical solution is better than the standards solution.


My stupid mistake was that I forgot to put spaces between as I set spacing with padding. I had like <span>Bla 1</span><span>Bla 2</span><span>Bla 4</span>
and it wasn't breaking line as I thought it should. So now I have:
<span>Bla 1</span> <span>Bla 2</span> <span>Bla 4</span>
and of course it works as it should and is anticipated.

Maybe my mistake will help someone....

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜