Okay
  Public Ticket #1175162
text 'wrapping' in responsive
Closed

Comments

  • JonSid started the conversation

    Hi Zaffer - thanks again for your great app and approach to looking after users/customers. I have left a great review which you deserve.


    On this portfolio page tempplate I am struggling to include ['wrap'] the text into the frame of the page. How can I use YP to fix this?

    Screen width 640 and below in responsive mode.

    [I see that the text block beneath does 'wrap' the text but I am not sure why.]


    Hopefully it's something simple that I can do with your plugin.

    Guy

  •  127
    Zafer replied

    Hey There,

    Thank you for your 5-star rating!

    There is an element class called ".wrapper", you must update the width of this element.

    Please follow these steps;

    1. go to this page
    2. WordPress Top Bar > Edit With Yellow Pencil > Edit Portfolio Template
    3. Open Responsive Tool and resize the page to 640px screen width
    4. Press F key, clean the input and type: .wrapper and press Enter
    5. and change the width from Editor Panel > Size as you want.

    I recommend you to use percent instead of pixel, Please try 80% - 90% value for width.

    I hope that's help,

    Best Regards

  • JonSid replied

    Hello Zafer and thank you again. But this doesn't actually help bring text into view... unless I change text size, which is not an option. I can change the wrapper size but the text still doesn't come inside the wrapper.
    Any ideas?

  • JonSid replied

    hi Zaffer, It's been some days now with no reply. Can you check this please??

  •  127
    Zafer replied

    Hey Jon,

    I'm sorry for late reply.

    I see there some elements have the dynamic width, you must reload the page after edit wrapper width. Please resize the wrapper element as you want, save changes.

    Okay, now reload the page and check if this works. Does the problem persist?

    Maybe you need to add "word-wrap" property to the wrapper. This property is not available in the editor, you must add this property manually.

    Please follow these steps;

    1. go to this page
    2. WordPress Top Bar > Edit With Yellow Pencil > Edit Portfolio Template
    3. Open Responsive Tool and resize the page to 640px screen width
    4. Press F key, clean the input and type: .wrapper and press Enter
    5. Open CSS Editor from left bar, and copy this rule: "word-wrap: break-word; " and paste to CSS Editor. (Don't change the line, just paste it)
    6. and change the width from Editor Panel > Size as you want.

    I recommend you to use percent instead of pixel, Please try 80% - 90% value for width.

    I think "word-wrap" property will help you!

    Thank you for your patience!

    Best Regards

  • JonSid replied

    Hello Zafer and thank you. Word wrap does work! 

    However. ... the problem I an having now is that it breaks the words in two between lines! 

    So. ... this is our next challenge. Please can you look?


  • JonSid replied

    Hi Zaffer. Do you have a solution to the word-breaks in the 'word-wrap'?

    https://studiohamilton.co.uk/portfolio/del-tongo-cucine/#close

    ...in responsive sizes you'll see the problem.

  •  127
    Zafer replied

    Hey Jon,

    Some heading and paragraphs don't wrap well because there is very much letter spacing.

    "SINCE 1954 KITCHENS FROM TUSCANY TO THE WORLD"

    Please set 0px or 1px value to letter-spacing option from Right panel > Text.

    I hope that's help. Thank you for your patience!

    Best Regards