When I access it on my phone there seems to be some whitespace on the right size, especially on the following menu:
I use site origin page builder, and it seems it is when my row uses “fully width stretched”..
Also if my headings are a big word consisting of more than 15 characters (which is normal in Danish), the mobile version seems not to show it in two lines but one line creating space on the right side.
The word “samarbejdspartnere” on my home page seems to not viewed on mobile version..
I have added this in the css from reading others.
@media (max-width: 680px) {
#main {
padding-right: 5px;
padding-left: 5px;
}
}
Hi Anushan
Thanks for reaching out.
You can remove the Custom CSS, your theme doesn’t have a div with the ID
main, at least as far as I can see.Regarding “samarbejdspartnere”. There may be an issue with FitText which handles the dynamic resizing. Please, try running a quick test. Temporarily deactivate all plugins not authored by SiteOrigin. If you’re using a caching plugin, clear it before deactivation. In that state, does the “samarbejdspartnere” issue improve on mobile? Let’s try to solve this first, we’ll go from there.
Hey Andrew,
Thank you for your quick reply.
When I remove the Custom CSS, there’s a white space on the following page: http://anushanruban.dk/anushan/
But I’ve changed the titles, so they aren’t that big, but on my home page, it’s still an issue
Also I tried cleaning cache, and then deactivate all plugins not authored by SiteOrigin, however the word seems to be going out on the right site making that white space on the right side.
Furthermore, on: http://anushanruban.dk/anushan/ on the mobile device, there seems to be a glitch, where my hero image starts small but gets zoomed in. I use mobile padding on the row.
I have loaded screenshot of my settings: https://we.tl/t-KSguPjBlXo
Thanks for your feedback.
Which device are you testing on? At the moment, I’m unable to replicate the issue.
Let’s try two steps:
1. Please, edit the page, click Layouts > Import/Export > Download Layout. Upload the JSON file to WeTransfer and send us the link so we can try testing locally.
2. Try to temporarily switch to another theme like say SiteOrigin Corp. Edit the page and use the Page Layout (in the right column) option to select No Sidebar. The test is to briefly see, does the overflow issue occur with another theme?
Custom CSS:
There isn’t a div with an ID of
mainin the page so I’m unsure what effect the Custom CSS could have. A CSS rule like that is specific to the theme. If the theme doesn’t have a container with a matching ID name (main), the CSS won’t take effect.When running the theme switch test, please, also check the Hero issue you mentioned.
Hey Andrew,
I’m testing on my iPhone 7 running the latest iOS..
1. Here’s the link to the JSON file: https://we.tl/t-DxWtoC6mPp
2. I’ve switched to the SiteOrigin Corp. theme, also I tried the option of no sidebar, but the problem is still occurring.
I’ve a screen capturing of it in the wetransfer folder.
Also, on page: anushanruban.dk/anushan – you might see how the picture goes from one size to another once I scroll down.
Hi again Andrew,
Since I reinstalled my theme back from Siteorigin, it seem that my background video on the hero widget doesn’t play automatically, I get a play button on my mobile device even though I’ve muted the video and checked the slider option that has been told from other forums..
Hi Anushan
Sorry for the delay, my workload has been a little over the top the past two days. I’ll be able to investigate further tomorrow. I’ll set this up locally, investigate and reply ASAP. Thanks for the wait.
Headline Widget Text Overflow
To deal with possible overflows of the Samarbejdspartnere heading on your home page. Try editing the Headline widget and changing the FitText compressor value to
1,1. We’re taking a look at why FitText isn’t properly handling this word but changing the compressor value is a step that can be taken now to prevent overflows arising from this widget. Please, let me know how it goes. Thanks.We looked into the FitText issue for the Samarbejdspartnere headline. FitText bases its resizing on the size of the container. The word is so long that it exceeds the width of the container and it overflows it. In summary, this appears to be a limitation of the FitText library. On the FitText page we find: “If your text is full width, you might want to NOT use FitText and just use CSS vw units instead. Supported in all major browsers.” ref: https://github.com/davatron5000/FitText.js/.
Option 1: Change the compressor value as I mentioned in my last reply, perhaps to
1,1.Option 2: Disable FitText and instead of
emchange the unit of measurement for your font size tovw. Some adjustment to the value will be required. More onvwhere https://www.w3schools.com/cssref/css_units.asp. “Relative to 1% of the width of the viewport*”.Video issue
I’m not sure what the video is exactly. It plays on iOS Safari but not on iOS Chrome. You perhaps confirm that on your own device. I’m not sure what might have changed but perhaps you could look into the format that it was exported in.
Thank you. I think it’s working now :=)
Super, glad to hear you’re making progress :)