- This topic has 11 replies, 3 voices, and was last updated 6 years ago by
.
Hi there.
I am using icon box slider with 5 tabs. It works perfectly on PC. However, when I am viewing my website on iPad 9.7 (vertical mode) and on iPhone 8, 2 to 3 tabs get cut off. Is there a way to resize the size of the tab so that all tabs can be seen neatly on mobile?
Next, in my About page, I will like the flow of information to be shown on mobile. About Me (1) > Write up About Me (2) > Why Choose (4) > Write up on my choice. (3) Currently it shows up in the sequence (1), (2), (3), (4) on mobile.
Please advise. Thank you so much!
Hi @pzl,
I hope you are well today and thank you for your questions.
I am using icon box slider with 5 tabs. It works perfectly on PC. However, when I am viewing my website on iPad 9.7 (vertical mode) and on iPhone 8, 2 to 3 tabs get cut off. Is there a way to resize the size of the tab so that all tabs can be seen neatly on mobile?
It displays fine for me as shown in the attached screenshot so could you please share me the screenshot of the issue?
Next, in my About page, I will like the flow of information to be shown on mobile. About Me (1) > Write up About Me (2) > Why Choose (4) > Write up on my choice. (3) Currently it shows up in the sequence (1), (2), (3), (4) on mobile.
I don’t see all these sections on your shared site. May be you have changed it now.
Could you please use the exact terms used to refer the sections and tell me the sequence again so that I can help you?
Best regards,
Shufflehound teamHi Shufflehound Team,
I am well, thank you.
My apologies for the confusion. Yes, I have updated the sections a little as the website is live. Here is my updated query:
On Jevelin Corporate Demo, under the icon box slider – Planning the Project, Idea Generating, etc. All tabs are shown neatly on PC. However, when I viewed it on mobile, I can only view two of the tabs. I have attached a screenshot for your understanding. (Att: Image.png) I was hoping that all tabs can be shown on mobile, as it is not intuitive to mobile users to know that there are additional tabs, e.g. Realization, Other
In my About page, (Att: about.png), I have labelled the section 1,2,3,4. It looks perfect on PC. However, on mobile, the section shows up as 1,2,3,4. (Att: mobile.png). I will like it to be 1,2,4,3. Please advise on how I can change the sequence.
Thank you so much!
Solution for this topic
On Jevelin Corporate Demo, under the icon box slider – Planning the Project, Idea Generating, etc. All tabs are shown neatly on PC. However, when I viewed it on mobile, I can only view two of the tabs. I have attached a screenshot for your understanding. (Att: Image.png) I was hoping that all tabs can be shown on mobile, as it is not intuitive to mobile users to know that there are additional tabs, e.g. Realization, Other
This is how it works currently but will implement your suggestion in the future version of theme.
In the meanwhile you can set it to auto play or display arrows as shown in the attached screenshot.
In my About page, (Att: about.png), I have labelled the section 1,2,3,4. It looks perfect on PC. However, on mobile, the section shows up as 1,2,3,4. (Att: mobile.png). I will like it to be 1,2,4,3. Please advise on how I can change the sequence.
We can achieve this developing custom CSS code.
For that on your site please display the sections in the sequence 1,2,4,3 then I will develop custom CSS code for you to display them in the sequence 1,2,3,4 on desktop.
I have noted on the information for the icon box slider. Certainly looking forward to the future release of this theme.
I have displayed the section as 1,2,4,3 for both desktop and mobile. Please advise on the CSS code to display it as 1,2,3,4 for desktop.
Thank you so much team! Your post sales service is really amazing.
It is still displaying for me in the sequence 1,2,3,4 as displayed in the attached screenshot.
Could you please clear the cache used on your site and temporary deactivate it?
Hi there,
My apologies. I have cleared the cache. Should work now. Thanks.
Solution for this topic
You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
@media (min-width: 800px){ .sh-column.sh-column-1ac102d6d45a053dcff25697800ee620.fw-col-xs-12.fw-col-sm-6 { float: right; } }Wow. That works perfectly! Thank you so much for the assistance. Cheers!
You are most welcome here 🙂
Hello,
I have the same issue that the icon box slider only display 2 elements on mobile (e.g. iPhone). The other ones are just hidden. Arrows are activated but aren’t displayed. I hope the icon box slider will be extended for future releases.
Thanks,
Eric
@Eric This topic is resolved so to help us keep support thread separates could you please create new thread for each of your other questions instead of asking them in your single thread as it makes the thread messy and hard to read.
If you want to you can also add reference of this thread in your newly created thread.
We would be more than happy to help you on your new thread.
