Menu
I'm looking to prevent a line break after a hyphen - on a case-by-case basis that is compatible with all browsers.
Example:
I have this text: 3-3/8" which in HTML is this: 3-3/8”
The problem is that near the end of a line, because of the hyphen, it breaks and wraps to the next line instead of treating it like a full word...
3- 3/8" I've tried inserting the "zero width no break character",  with no luck...
3-3/8” I'm seeing this in Safari and thinking it will be the same in all browsers.
The following is my doctype and character encoding...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> Is there any way I can prevent these from line-breaking after the hyphen? I do not need any solution that applies to the whole page... just something I can insert as needed, like a "zero width no break character", except one that works.
Here is a Demo. Simply make the frame narrower until the line breaks at the hyphen.
http://jsfiddle.net/RagKH/
843
Nonbreaking hyphens prevent hyphenated words, numbers, or phrases from breaking if they fall at the end of a line of text. For example, you can prevent 555-0123 from breaking; instead, the entire item will move to the beginning of the next line. Click where you want to insert a nonbreaking hyphen.
Don't end a line on a hyphen in rag-right or centered text, unless the word that's breaking is a hyphenated compound that breaks at the grammatical hyphen. Don't let two lines in a row end in hyphens. Don't break words within a hyphenated compound.
To type a hard hyphen you will typically press the key to the right of the zero key (or if you want a non-breaking hyphen it's Opt/Alt + Cmd/Ctrl and do the same). To insert a soft hyphen, simply hold down Shift + Cmd/Ctrl and press the key to the right of the zero key.
Try using the non-breaking hyphen ‑. I've replaced the dash with that character in your jsfiddle, shrunk the frame down as small as it can go, and the line doesn't split there any more.
94
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
