Page using tabs does not resize nor respond

[Feirbrand]

I commented on the Kleo Discussion page about an issue I was having and was asked to create a topic on the support forum. I have copied the conversation below. This is a big problem since my clients are unable to use the table when they shop or need to make exchanges. Any help would be greatly appreciated.

Me:
I have a page that is setup using the Visual Composer tabs. Each tab contains one macro each (protein, carb, fat). This is for my clients so they can make exchanges in their meal plans. However when it is viewed on a mobile device the page does not line up correctly, cannot be swiped laterally nor can it be pinched to zoom in/out. Is this normal due to the tabs?

http://www.achievepeakperformance.net/food-list-macros/

sq_support:
Please add the following rule in “Theme Options > General > Quick Css” :

COPY CODE

.tab-content > .tab-pane {
    overflow-x: auto;
}

Let me know if it did the trick. Cheers

Me:
Thanks for the quick response. I applied the code but it did not work. In cellphone portrait it shows the serving size and some of the food names. Everything else to the right is cut off. The tabs now show up and work properly, however the screen is still cut off and it will not slide nor pinch. I can do a separate page for each if this is not a current option in VC yet.

Attachments:

You must be logged in to view attached files.

[sharmstr]

I think the issue is that there is an explicit table width being set. If I override it, it displays all content. See attached

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

Attachments:

You must be logged in to view attached files.

[Feirbrand]

Thanks for the reply. I tried using Firebug but I was unable to find the same code as css-override.png Where would I find that? Is the highlighted area you show what I should change it to? I am a rookie when it comes to css.

[sharmstr]

Yes. That’s the css I added.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Feirbrand]

This reply has been set as private.

[sharmstr]

Did you respond privately because you’re embarrassed? Don’t be.

Add it to Theme Options > General > Quick css

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Author]

Posts