sophieacs Posted January 18 Share Posted January 18 (edited) Hi, I have some text (project titles) that are set to full width of content on my site, it all looks fine when full screen on desktop, but when I scale the browser down the text visibly overflows to the right of the block into the white margin. I would like to contain the title in the block and have the text responsivley scale down within the full width block (not breaking the line or overflowing). I have tried to use a text box with heading 1 font settings and some custom CSS to achieve a responsive design that contains the title when scaling, aswell as using a code block and writing my own CSS, both have same result... I feel like I'm missing something and can't find another answer to this issue, any help appreciated. Thanks Link to title example: https://www.alexchinneck.com/in-a-while-crocodile-test Edited January 18 by sophieacs Link to comment
tuanphan Posted January 19 Share Posted January 19 Because you use white-space: nowrap; Add this to Design > Custom CSS @media screen and (max-width:1200px) { .title { white-space: normal; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
sophieacs Posted February 9 Author Share Posted February 9 Hi @tuanphan Thanks for your response, I tried the code you suggest in the custom CSS section but hasn't achieved the result I am aiming for. At full screen the title is full width but as soon as I scale the browser window down it breaks the title onto a new line rather than scaling the text responsively and maintining the single line. I have attached a screengrab of the issue and left the code in place on the original link above to test. Any further assistance would be really appreciated. Thanks Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment