Have hyphenation depend on “display size”

  • Resolved wpguillaume

    (@wpguillaume)


    4 years, 6 months ago

    Hello,

    We’ve enabled the hyphenation feature. It’s great. ??

    But we feel it’s not always necessary, if the text it’s applied to is displayed “large enough”, for instance in the main column of a blog, displayed on a desktop screen.

    Is it possible to specify where and when to enable this feature? Perhaps with some CSS instructions applied to pages and posts contents, depending on the @media rules?

    Thank you very much.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author pepe

    (@pputzer)

    Hi @wpguillaume! wp-Typography itself cannot be controlled via CSS because it does it’s work on the server before the page is delivered to the browser. wp-Typography only adds hyphenation points, the actual line breaking is done by the browser.hyphens: none should prevent hyphenation from occurring on modern browsers.

    Thread Starter wpguillaume

    (@wpguillaume)

    Hi!

    Thank you.

    I tried this:

    @media screen and (min-width: 44.375em) {
	.entry-content {
		hyphens: none;
	}
}

    It works indeed.

    Do you know of any way to detect the line length, to refine the hyphenation?
    Ie, if there’s just text in the entry content, the line is long, hyphenation becomes optional. If an image is inserted in the content, the length of text lines is reduced, and hyphenation is required.

    Plugin Author pepe

    (@pputzer)

    I don’t think this is something that you can do in pure CSS. (With JS, yes, but you might have to work around re-rendering issues. Overall, I would not recommend this approach.)

    Thread Starter wpguillaume

    (@wpguillaume)

    Ok, thank you very much!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Have hyphenation depend on “display size”’ is closed to new replies.