How do i stop text from breaking in css?

• This topic is empty.

Viewing 9 posts - 1 through 9 (of 9 total)

• Posts

• November 16, 2013 at 10:27 pm #156282

  http://stagedecommerce.webeclectic.com/

  I’ve tried different white-space and word-break properties. How can I get the text on these paragraphs to avoid hyphened word breaks and have the text center justified. Center justified meaning not only text aligned center but actually justified.

  November 16, 2013 at 10:50 pm #156284

  __

  Participant

  How can I get the text on these paragraphs to avoid hyphened word breaks …?

  &​#8209; (copy+paste: ‑) is the non-breaking-hyphen entity. AFAIK browser support is solid, though it may vary in appearance depending on the font used (most fonts don’t include this character, so you may see system substitutions).

  You can also use CSS:

  no-breaks-here
  

  Center justified meaning not only text aligned center but actually justified.

  Could you explain further…? “Centered” and “justified” are mutually exclusive concepts.

  November 17, 2013 at 12:17 am #156289

  __

  Participant

  http://jknetdesign.com/images/bluopal-forum.png

  Both columns (except the list) in that shot are justified, not centered.

  The last line aligning left is normal behavior; there are semi-hacks to justify the last line. FireFox and IE also support the text-align-last property (webkit may jump onboard eventually, I think it’s an up-and-coming spec) if you want the last line right-justified or centered.

  This a WordPress theme so I am depending on CSS. I tried nowrap and the text spread across the entire page…

  You would have to change the markup. Either by replacing the character itself, or by wrapping the text-in-question in a span before applying nowrap.

  November 17, 2013 at 2:13 pm #156335

  __

  Participant

  I added a span class called nobreak and wrapped the paragraphs and it’s all across the screen.

  You misunderstand: don’t wrap the paragraphs (unless you want them all across the screen). Wrap the words that you don’t want to break.

  This is my paragraph.  It will wrap normally, except for the part about happily-hyphenated-hillbillies.
  

  Having justified text is going to be a nightmare on a responsive site — or with narrow columns.

  Yeah. At the very least, make sure any justified text is in a container with a minimum width.

  November 17, 2013 at 3:11 pm #156340

  __

  Participant

  Why would I wrap each compromised word when I can just add a br tag?

  I’m not sure I understand. You would wrap the individual words so the nowrap property applies only to them, rather than to the entire text (which, I gather, is not what you want).

  How would adding a
tag help prevent line breaks?

  make sure any justified text is in a container with a minimum width

  That’s what I was looking for! I knew there was another property needed to assist the nowrap.

  That suggestion was meant to for the “ugly-justified-text-in-narrow-columns” issue. It doesn’t affect text wrapping at all.

  June 1, 2015 at 4:44 am #203031

  It’s quite a while since this was asked, but, anyway, maybe somebody finds it. What jknetdesign was looking for, I think, is:

  -webkit-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;

  Good day.

  June 2, 2015 at 8:10 am #203093

  I didn’t about the hyphens rule.

  Thanks

  June 2, 2015 at 8:21 am #203094

  April 30, 2017 at 5:43 am #254347

  I found it! Thanks, did the trick.

• Author

  Posts

Viewing 9 posts - 1 through 9 (of 9 total)

• The forum ‘CSS’ is closed to new topics and replies.

How do you make words not break?

How do I keep text in one line in CSS?

How do you stop text wrapping?

How do I manage text