Buy Now
Sign in

Chronoforms v6 Partition Area Tabs

drgolden , May 02 2018
D
drgolden 15
May 02 2018 #377444
In v5 a tabbed form displayed all the tabs within the bounds of the page by creating new lines:v5_tabs.png
However in v6 using partition area tabs, the tabs go across the page and don't create new line(s) as below. (There are actually 4 tabs that are not displayed in the image below) I can't find any setting, etc. Is there a setting or worklaround I am missing?
v6_tabs.png
healyhatman 5.2
May 02 2018 #377449
You can set the overflow settings on the tabs with custom CSS. Have a search on the forums I posted a reply about fixing this issue (I can't find it for you I'm out at the moment). Or send me a PM and I will find it when I get home.
You need to set overflow and overflow-x settings to enable you to scroll the tabs when they go off screen.
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums
healyhatman 5.2
May 03 2018 #377451
OK I got it.
Add the following to your css
div.ui.top.attached.steps.G2-tabs { overflow:auto; overflow-y: hidden; }
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums
D
drgolden 15
May 03 2018 #377452
Thanks for the help. I found your solution about 30 mins ago, and have been working with it. That is a solution that will work. It creates a nice slider under the steps.
Originally, I was looking to replicate the v5 multirow tabs (as in my first image), but haven't found any way to replicate that design.
healyhatman 5.2
May 03 2018 #377453
You can add "stackable" to the Class field of the Partition.
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums
D
drgolden 15
May 03 2018 #377454
I am a little thick headed. Under Designer, Area Partition, Edit , the Class is "ui container fluid". Is this where stackable goes. I have tried multiple iterations and no joy.
healyhatman 5.2
May 03 2018 #377455
Yes add it to the list. Maybe remove the custom CSS I had you add.
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums
D
drgolden 15
May 03 2018 #377456
Still no joy. Here are screenshots of the setup and results:
ttl.png
Attachments
v6BE.png
v6BE.png
(27.53 KiB)
237 Downloads/Views
v6FE.png
v6FE.png
(113.06 KiB)
232 Downloads/Views
ttl.png
ttl.png
(138.33 KiB)
291 Downloads/Views
healyhatman 5.2
May 03 2018 #377457
Leave my code in then, I think the stacked class only works for mobile views . Should be able to resize the window or use Chrome developer mode with the device view to see it in mobile view.
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums
D
drgolden 15
May 03 2018 #377458
Thanks for your help. I think I will go with your original suggestion.
healyhatman 5.2
May 03 2018 #377459
If you want it stacked on mobile you can just do both things
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums