Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • January 6, 2015 at 1:41 pm #375651
    Magellan

    Hello,
    sorry to bother with my issue. I searched the forum but no chance.

    I am facing text format problems in responsive mode. Depending on the size of display screen, the text might look weird, sometimes the break in the line is made in a very silly way (just a question mark or a dot on the following line)
    ie:
    “Imagine this is a sentence that would spread nicely in the full width of the screen except for the question mark
    ?”
    Same could happen while using quotes.

    i am looking for a way to avoid this and make the question mark or quote stick to the last word or even the group of words.
    I tried to insert   in between the words to make them stick together. I have done that through the text editor. But they disappear after validation and nothing is done to the page.

    Thanks for your help.

    Thomas

    • This topic was modified 9 years, 10 months ago by Magellan.
    January 6, 2015 at 2:19 pm #375672
    Yigit

    Hey Thomas!

    Can you please post the link to your page and point out an example so we can provide you a more accurate solution?

    Regards,
    Yigit

    January 6, 2015 at 3:05 pm #375692
    Magellan
    This reply has been marked as private.
    January 7, 2015 at 4:03 am #375972
    Andy

    Hi!

    to avoid this go edit your textblock and insert breaks into your text using shift+enter.

    Regards,
    Andy

    January 7, 2015 at 10:39 am #376042
    Magellan

    hi Andy,

    thanks for your help. unfortunatly that won’t do the job.

    What i want to do is to offset the impact of responsive on a text block. Sometimes, given the size of the font, the screen resolution, etc, in a text line there is just a solo word or even a writing symbol that won’t fit and will be put on the next line (here are some exemple – in french though: https://www.dropbox.com/s/npgg4wojgo2nh1k/pb%20wordbreak.jpg?dl=0 ).

    I think I could avoid that by creating a link between the words or characters (using “& nbsp;” – note that I had to put a space in between & and nbsp so it does not disapear in this post)
    “) so the full group will be consider as one word and will not be broken into pieces. And I will avoid having just a solo character (quote mark, dot, question mark) or a solo word on the following line.

    The problem is that when I add the expression “& nbsp;” in the edit text bloc it does not take it. it has no effect on the text and when I open the edit mode again, I can not find, in the code, the expressions ” ” I added.

    thanks heaps for your help.

    • This reply was modified 9 years, 10 months ago by Magellan.
    January 7, 2015 at 2:56 pm #376150
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 1140px) {
.avia_textblock h4 {
font-size: 17px;
}}

    That code seems to do the job on my end. Please try it and let us know

    Cheers!
    Yigit

    January 7, 2015 at 3:38 pm #376186
    Magellan

    Hey Yigit,

    thanks for your help, but it apparently does not wrok for me.

    Here a screenshot of the problem occuring when resizing the browser.
    https://www.dropbox.com/s/v0cy6psm8ojhjji/pb%20wordbreak%202.jpg?dl=0
    The question mark is solo on tha last line.

    i might have done a mistake in the code, so here is a screenshot in the code:
    https://www.dropbox.com/s/depodxmalzzatm3/pb%20wordbreak%202%20-%20code%20added.jpg?dl=0

    and I have a question, will the code work only with H4 style or with all style ?

    I know that automated formating is better that manual formating, but is there a manual trip that i could use on certain text bloc only.

    Thanks again.

    January 8, 2015 at 4:15 am #376606
    Ismael

    Hey!

    Did you actually test this on a mobile device or you resize the browser until a single word drops on the last line? You can modify or alter a specific text block by adding a custom css class selector. Refer to this link for more info: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

    Best regards,
    Ismael

    January 8, 2015 at 11:32 am #376704
    Magellan

    Hi Ismael,

    thanks for your reply.

    I did test on a mobile (no problem occured) and on browser that I resized (problem occurred).

    I checked in functions.php of the enfold theme (we are using a child theme) and I found the custom css enabling code in this file. My functions.php file in the child theme is blank though.

    And unfortunatly, as i am not a web designer, I do not know how to use CSS. I am trying to fix the mess made by the person in charge of th website.

    thanks for your time and effort guys, I really appreciate.

    January 10, 2015 at 3:42 am #377672
    Josue

    Hey!

    I was unable to reproduce the issue on my browser, nevertheless if the problem doesn’t occur on an actual mobile device i don’t think it’s something worth worrying.

    Regards,
    Josue

    June 21, 2017 at 11:02 am #810893
    vdarend

    Hi I’m experiencing the same at the following page http://op.bo-project.nl/
    Above the pictures within the blue beam there’s a title that looks nice on desktop, but when I look at it on mobile it doesn’t. Well, only for telecommunications. Can you help me out?

    June 22, 2017 at 5:01 am #811317
    Rikard

    Hi,

    Please try the following in Quick CSS under Enfold->General Styling:

    .slide-entry-title a {
    word-wrap: break-word;
}

    Best regards,
    Rikard

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