Hi everyone, I am new to web this week and just staring to build my landing page on it with an emphasis on responsiveness. I think I have got the general gist of it (struggling with the discipline of using classes though).
The major problem I am tearing my hair out with is having is with paragraph text overflow from the div block I am putting it in when reducing screen width. See screenshots:
I see you have been busy! I’m not sure what your knowledge is around CSS. One of the fundamental parts of building websites. And because Webflow is a professional tool for designers, it doesn’t mean that the basic rules of the web isn’t needed to be able to create top level sites.
I have attached a short video of what you was doing slightly wrong. I have noticed if you copy and paste text directly into a text box, sometimes it doesn’t see the line break, so a simple space added will fix the issue with text overlapping. Also have a look at the ‘position’ property this is sometimes key for things not working correctly. Sometimes setting things to relative will fix the overlapping issue.
Have a watch of the video and just let me know if that fixes the issue or if you need more assistance, and I’ll try my best to help!
Yeah I totally understand, it’s a learning curve, but luckily you only need to learn a few basic properties and you will be away! We all start somewhere!
Ah maybe the link wasn’t shareable. Try this link, let me know if you still have an issue viewing the video
Thanks for your help Steve but I am still having trouble with the text wrapping. What is annoying me is the intermittent nature of it working - sometimes it does what I want but other times not with the exactly the same settings!! I just can’t work it out.
Take the FAQ section I am working on for example.
Some of the boxes wrap and some don’t - I just cant work out what I’m missing. Surely I don’t need enter the line breaks manually and do two versions of the text box, hiding one in the desktop view? I would be amazed if this is the standard web dev process.
Here is a loom showing it working. It is even works when I view the published site on my phone.
I see your frustration! It could be a bug, or it could be something else that is conflicting it, as I never have this issue… However, I have gone in and found that if you add a space between the word and then delete it, it fixes the issue… I think maybe it could be when copy and pasting text from another document, sometimes Webflow doesn’t see the spaces, and thus it thinks it’s all one word and doesn’t automatically line-break. This seams to fix the problem.
Can I ask how you are putting this text in, are you copy and pasting by any chance?
Hopefully, you will find Webflow easier to use as the time goes on, and you will be flying!
There could be something else in the document that is stopping this from happening. Like I see you have objects that go outside of the body. See attached image bellow.
Sometimes if you don’t set ‘overflow’ to hidden. It might cause issues, thinking the size of the browser has more room to play with so to speak.
Let me know if this helps the issue. If you send me the updated read-only link and a link to the live Webflow.io URL i’ll take another look, see if there is something restricting it.