Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • January 26, 2015 at 1:03 pm #385404
    MaxJulian

    Hi,

    is there a way to get hyphenation to work with Enfold?
    I’m setting up a website (in German) and because of the topic of Psychotherapy some words are too long for the mobile view.

    Especially when you use the “icon list” element, long words will be cut of in the mobile view. This problems worthens when you view the site on a smartphone instead of a small browser window on a desktop computer.

    My initial solution was to change the font size in smaller viewports via “@media only screen and ” code, but if there is a way to hyphenate the words, this would certainly be a better solution.

    • This topic was modified 9 years, 10 months ago by MaxJulian.
    January 26, 2015 at 11:15 pm #385918
    Elliott

    Hi MaxJulian!

    Your text looks fine on my end. It’s wrapping the correct way.

    The only problem I see is that it uses the full length of the header so the responsive menu button displays over it. You can shorten the area a bit with this CSS.

    .responsive #header_main .inner-container {
  width: 80% !important;
}

    This will make it so the text does not display behind the menu button and will still be readable on small screens.

    Regards,
    Elliott

    January 27, 2015 at 12:14 pm #386150
    MaxJulian
    This reply has been marked as private.
    January 28, 2015 at 10:08 am #386846
    Ismael

    Hi!

    Try to decrease the font size of the icon list title on mobile device:

    @media only screen and (max-width: 767px) {
h4.iconlist_title {
font-size: 25px !important;
}
}

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.