WordPress.com Forums » Topic: Hyphenation

designsimply on "Hyphenation"

designsimply — Sun, 24 Feb 2013 06:16:20 +0000

You have a better eye than me! Also, I did first check it in Chrome where the breaks actually don't happen.

I researched this and found that you need to use special browser prefixes for WebKit browsers like Safari and Firefox. Try adding this to your Appearance → Custom Design → CSS editor:

p {
    hyphens:none;
    -webkit-hyphens: none;
    -moz-hyphens: none;
}

withwords1 on "Hyphenation"

withwords1 — Sat, 23 Feb 2013 10:10:15 +0000

Hi there.

There are two hyphenations in your screen shot. Second paragraph, first line as - sortment; third paragraph, first line drive - way.

I'm using Safari 5.1.7; the same thing happens in Firefox 18.0.2.

I would prefer no hyphenation, and I am pretty sure there is a CSS code to eliminate that. What I don't know is what selector controls the main content area of the blog. Can you tell me that?

designsimply on "Hyphenation"

designsimply — Thu, 21 Feb 2013 16:49:21 +0000

The plot thickens. I don't see breaks in those words at all. When I check http://randomactsofwriting.wordpress.com/2013/02/13/lessons-in-snow/ here is what I see:

http://cl.ly/N4Fz

Can you make a screenshot of your entire browser window and post a link to it here so we can try to see what you're seeing?
http://en.support.wordpress.com/make-a-screenshot/

Also, what browser and browser version are you using?

withwords1 on "Hyphenation"

withwords1 — Mon, 18 Feb 2013 20:52:55 +0000

Got it! Sorry - didn't mean to be so general. : )

In particular, I'm not thrilled with how the hyphens are working in the actual post content. If you look at (http://randomactsofwriting.wordpress.com/2013/02/13/lessons-in-snow/), you can see how so many of the words are breaking awkwardly: re-ports, as-sortment. I'd rather have the text not hyphenate at all. Is that possible?

designsimply on "Hyphenation"

designsimply — Mon, 18 Feb 2013 18:52:05 +0000

That all depends on where you're seeing the hyphens. Also, it's possible the "hyphens" property is not the right thing to use depending on how the hyphens are getting added. The most helpful thing you can do is link to an example on your blog where you are currently seeing hyphens so someone can help you take a closer look at a specific example. It's possible WordPress has some PHP programming in place to prevent orphans which overrides CSS like you are trying to add.

To answer your question more generally, the XX needs to be a CSS selector that matches whatever text you're targeting. Also, keep in mind that the rules I mentioned earlier only apply when soft wrapping happens.

So, in the Twenty Twelve theme, to target widget titles, you would use this as the selector:

.widget-area .widget h3

withwords1 on "Hyphenation"

withwords1 — Thu, 14 Feb 2013 11:06:34 +0000

Thanks for the reply. I am pretty sure I can find my way through the CSS property options by trial and error, but I 'm having a hard time reading the template's CSS and can't figure out what Selector to use to change the body of the blog post. I believe the line of code I need to write is something like this:

XX { hyphens: none; }

So I just need help identifying what the XX is in the current code.

designsimply on "Hyphenation"

designsimply — Thu, 14 Feb 2013 01:12:57 +0000

In general, there are two different CSS properties for hyphenation:
1. http://www.w3.org/TR/css3-text/#hyphens
2. http://www.w3.org/TR/css3-text/#overflow-wrap

Try them out and if you're still having trouble, please post a link to where you're seeing the hyphenation happening and include a note about what you've tried already to prevent it.

withwords1 on "Hyphenation"

withwords1 — Wed, 13 Feb 2013 20:34:05 +0000

Hi. I'm using the template Twenty Twelve and would like to set the CSS so it does NOT hyphenate. I believe the correct CSS property/value is hyphens: none; but can someone tell me the correct selector? Thanks!