11

In the footer of a flexible-layout website I've noticed that IE tends to line-wrap on parenthesis characters (in a phone number in this case). Is there a visually equivalent non-breaking parenthesis, in a similar vein to non-breaking spaces and non-breaking hyphens, that I can use instead?

1
  • 1
    Maybe you could look for non-ASCII parentheses that you can use. I'm not sure if suitable ones exist, but that could be an option I guess. Commented Apr 26, 2010 at 10:38

3 Answers 3

12

Try this:

.phone{
    white-space: nowrap;
}

<p>Call Customer Support at <span class="phone">+34 (947) 12 34 56 78</span> for further enquiries.</p>

You can do many other things (from <nobr> tag to certain Unicode chars) but they aren't as cross-browser as this.

5
  • This is a good practical solution, however, I'm specifically looking for a pure html version, for non-css users (accessibility is a priority). Commented Apr 26, 2010 at 11:06
  • 4
    This is a minor cosmetic issue. Having an line break in the middle of a phone number is not an accessibility issue.
    – Quentin
    Commented Apr 26, 2010 at 15:40
  • @David Dorward That's not the point I was making. My priority is to provide as similar an experience as possbile without CSS. Also, I disagree, I think it is an accessibility barrier. Commented Apr 26, 2010 at 17:51
  • 1
    You can use <nobr> as this answer suggests if you don't want CSS, but I can't think of a single browser alive that doesn't support CSS. Commented Apr 27, 2010 at 5:15
  • Unfortunately this prevents breaking on everything. It may solve the OPs problem, but I have the specific problem from the title; I need to stop IE from breaking on parentheses, but still break on white-space.
    – David Hay
    Commented Jun 23, 2014 at 18:50
6

I ran into this issue with a plural treatment like "user(s)" where IE breaks the word after the R. You should be able to use the word joiner character (&#x2060;), but in my test with IE11, only the deprecated zero-width non-breaking space character worked:

user&#xFEFF;(s)
2

I have had the same problem; here is a solution which worked:

The number to call is: (423)&nbsp;276&mdash;0000

According to the Unicode Standard (specifically, UAX #14), a line break is not permitted before or after a no-break space. Therefore, the &nbsp; prevents the browser from line-breaking on the parentheses. In either case, it doesn't hurt to have a space between the area code and the phone number.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.