I’m using the Salient theme with the Quantum Portfolio elements, specifically the Split Line Heading block, to display my name prominently on my homepage. This Split Line Heading is a key visual element in my portfolio design.
The problem is that whenever a user visits my website for the first time on a new device, the Split Line Heading text overflows its container and cuts off part of my name. However, if the page is refreshed (or the visitor comes back later), the heading displays correctly within the container.
What I've tried:
Reducing the font size, the overflow stops, but it breaks my intended design style.
Adjusting other responsive typography settings, the issue still appears for new visitors.
No manual refresh or resize should be required for the heading to fit.
What I need:
I need a reliable fix so that:
The Split Line Heading always stays inside its container, at full intended font size, even for first-time visitors on any device.
The heading never cuts off or spills outside its container on initial load.
The design integrity is kept without having to shrink or manually adjust font sizes.
I’m hosting on Oracle servers using the Hestia control panel.
Can you please provide a solution or a reliable method to achieve this, without changing any of the core visual design typography?
Your optimization plugin is likely causing a delay in the "fit-text" feature in the Split line heading.
Could you try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.
I tried disabling the third party plugins, The LiteSpeed optimization plugin seemed to resolve the issue at first but it persisted in different browsers, so I tried disabling safe SVG and Disable Comments but that didn't seem to resolve the issue either. The issue also persists in my ipad but fixes itself the second you start scrolling.
That seems to have fixed this split line heading resizing issue on almost all devices,
The issue persists on the safari browser alone for a second until before you start scrolling and fixes itself right then and there, but it doesn't persist on the chrome browser, so idk what exactly is going on there but this fixes most of this issue.
This could be caused by caching on your site. Try clearing your cache and let us know if the issue persists. Please clear your cache using this guide: https://themenectar.ticksy.com/article/6226/.
Try these and let us know if the issue is resolved.
I’m using the Salient theme with the Quantum Portfolio elements, specifically the Split Line Heading block, to display my name prominently on my homepage. This Split Line Heading is a key visual element in my portfolio design.
The problem is that whenever a user visits my website for the first time on a new device, the Split Line Heading text overflows its container and cuts off part of my name. However, if the page is refreshed (or the visitor comes back later), the heading displays correctly within the container.
What I've tried:
Reducing the font size, the overflow stops, but it breaks my intended design style.
Adjusting other responsive typography settings, the issue still appears for new visitors.
No manual refresh or resize should be required for the heading to fit.
What I need:
I need a reliable fix so that:
The Split Line Heading always stays inside its container, at full intended font size, even for first-time visitors on any device.
The heading never cuts off or spills outside its container on initial load.
The design integrity is kept without having to shrink or manually adjust font sizes.
I’m hosting on Oracle servers using the Hestia control panel.
Can you please provide a solution or a reliable method to achieve this, without changing any of the core visual design typography?
Thank you for your help!
Attached files: Screenshot 2025-07-15 020903.jpg
Screenshot 2025-07-15 020923.jpg
2025-07-14 22-16-57.mp4
Hey Again,
Thanks for reaching out! .
Your optimization plugin is likely causing a delay in the "fit-text" feature in the Split line heading.
Could you try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.
Best,
Salient Support Team
Hey.
Thanks for the reply!
I tried disabling the third party plugins, The LiteSpeed optimization plugin seemed to resolve the issue at first but it persisted in different browsers, so I tried disabling safe SVG and Disable Comments but that didn't seem to resolve the issue either. The issue also persists in my ipad but fixes itself the second you start scrolling.
So at the moment I've turned it back on.
What else could I do ?
Thanks.
Attached files: Screenshot 2025-07-15 175420.jpg
Try turning off the "Delay Javascript Execution" feature and check:
Salient Support Team
That seems to have fixed this split line heading resizing issue on almost all devices,
The issue persists on the safari browser alone for a second until before you start scrolling and fixes itself right then and there, but it doesn't persist on the chrome browser, so idk what exactly is going on there but this fixes most of this issue.
Thanks.
Hi Mohammed,
Thank you for getting back to us.
This could be caused by caching on your site. Try clearing your cache and let us know if the issue persists. Please clear your cache using this guide: https://themenectar.ticksy.com/article/6226/.
Try these and let us know if the issue is resolved.
Thanks,