I’m using the Tabs element to display some text, and the problem is that on screens with a lower resolution, the text is pushing on the content below it, and messing up the formatting of everything - mostly the corners of the pictures not touching (See Screenshot vs. Screenshot1). Is there a way to fix this? Maybe add a scroll bar to the tab, if it is displaying too much information?
Thanks for the help.
Hello Benjamin,
Thanks for writing in! Regretfully there is no fix for you issue. You see, you have two different element, the slider and the tab element having a different height. The slider needs to initiate the slides by identifying the default height of its container which is the column. The tab content on the other hand have a varying height because of the height of the tabbed content panel.
You can only achieve a touching images along with the tab element if the images will be added as a background image of the column and not as a slider element.
Hope this explains it briefly.
Thanks, @RueNel. So i guess my only option would be to limit the text in the tab?
Also, not sure if this is possible, but …
On the desktop, the page makes sense with the alternating columns. IE. First row has column with pictures on the left and text on the right, second row has column with text on the left and pictures on the right, etc… On a mobile device, however, it just looks confusing and out of order because everything is stacked. Is there a way that for mobile only, I can switch the row/column orientations?
Hi,
Yes, you can limit the text in the tab.
With regards to alternating columns, please refer to the link below
Hope that helps.
Thanks, @paul.r!
Looks like you can do it without the code. In cornerstone, there is a ‘Hide During Breakpoints’ option.
Hi Benjamin,
Glad it helped. We also have a detailed guide on hide during breakpoints here (https://theme.co/apex/forum/t/hide-during-breakpoint-explained/17378).
Thanks!
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.